/* Platform metadata and references use the shared BluUI light/dark tokens. */
.component-tags {display:flex;flex-wrap:wrap;align-items:center;gap:7px;}
.component-tag {display:inline-flex;align-items:center;max-width:100%;padding:5px 9px;border:1px solid var(--bluui-border,#dddde5);border-radius:7px;font-size:11px;font-weight:650;line-height:1.45;text-decoration:none!important;color:var(--bluui-text,#262536);background:var(--bluui-surface,#fff);}
.component-tag--web {color:var(--bluui-primary,#5941a0);background:var(--bluui-surface-muted,#f5f3fb);}
.component-tag--free {color:#286142;background:#eef8f0;border-color:#c8e3cf;}
.component-tag--native {color:var(--bluui-text-muted,#5a5a6b);}
.public-component-card .component-tags {margin:2px 0 20px;}
.blu-page-header__actions {flex-wrap:wrap;}
.catalog-edition-note {max-width:820px;margin:24px 0 28px;color:var(--bluui-text-muted,#595868);font-size:14px;line-height:1.7;}
.catalog-edition-note a {color:inherit;text-underline-offset:3px;}
.api-platform-bar {display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin:0 0 24px;border:1px solid var(--bluui-border,#dddde5);border-radius:12px;background:var(--bluui-surface,#fff);}
.api-platform-bar strong {font-size:14px;}
.api-platform-bar p {margin:3px 0 0;font-size:13px;color:var(--bluui-text-muted,#595868);}
.api-platform-switch {display:flex;gap:4px;flex-shrink:0;padding:4px;border-radius:9px;background:var(--bluui-surface-muted,#f2f1f5);}
.api-platform-switch button {font:inherit;font-size:13px;font-weight:650;line-height:1.4;min-height:40px;padding:9px 14px;border:1px solid transparent;border-radius:7px;color:var(--bluui-text,#262536);background:transparent;cursor:pointer;}
.api-platform-switch button[aria-pressed=true] {background:var(--bluui-primary,#5941a0);color:var(--bluui-on-primary,#fff);box-shadow:0 1px 3px #00000012;}
.api-platform-switch button:focus-visible,.component-tag:focus-visible,.web-api-reference a:focus-visible,.web-api-type summary:focus-visible {outline:3px solid var(--bluui-primary,#6750b0);outline-offset:3px;}
[data-api-content][hidden] {display:none!important;}
.web-api-reference {min-width:0;color:var(--bluui-text,#262536);}
.web-api-intro {display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.web-api-intro h2 {font-size:27px;line-height:1.25;margin:9px 0 12px;letter-spacing:-.04em;overflow-wrap:anywhere;}
.web-api-intro p {max-width:780px;font-size:14px;line-height:1.7;margin:0 0 22px;color:var(--bluui-text-muted,#595868);}
.web-api-import,.web-api-signature {padding:17px 20px;border:1px solid var(--bluui-border,#dddde5);background:var(--bluui-surface,#fff);font-size:13px;line-height:1.8;overflow-wrap:anywhere;}
.web-api-import {border-radius:10px 10px 0 0;}
.web-api-import small {display:block;margin-top:9px;color:var(--bluui-text-muted,#595868);font-size:12px;}
.web-api-signature {border-top:0;border-radius:0 0 10px 10px;background:var(--bluui-surface-muted,#f5f4f7);}
.web-api-jumps {display:flex;flex-wrap:wrap;gap:8px;margin:18px 0;}
.web-api-jumps a {display:inline-flex;gap:7px;align-items:center;padding:8px 12px;min-height:38px;border:1px solid var(--bluui-border,#dddde5);border-radius:7px;text-decoration:none;color:var(--bluui-text,#262536);font-size:12px;}
.web-api-jumps span {color:var(--bluui-text-muted,#595868);}
.web-api-caption {font-size:12px;line-height:1.7;color:var(--bluui-text-muted,#595868);}
.web-api-section {margin-top:30px;scroll-margin-top:24px;}
.web-api-section-title {display:flex;align-items:center;gap:9px;margin-bottom:12px;}
.web-api-section h3 {font-size:18px;margin:0;}
.web-api-section-title span {font-size:12px;color:var(--bluui-text-muted,#595868);}
.web-api-section>p {font-size:13px;color:var(--bluui-text-muted,#595868);}
.web-api-table-scroll {width:100%;overflow-x:auto;border:1px solid var(--bluui-border,#dddde5);border-radius:10px;}
.web-api-table {width:100%;border-collapse:collapse;table-layout:fixed;background:var(--bluui-surface,#fff);text-align:left;font-size:13px;}
.web-api-table th,.web-api-table td {padding:13px 15px;border-bottom:1px solid var(--bluui-border,#dddde5);vertical-align:top;line-height:1.7;overflow-wrap:anywhere;}
.web-api-table thead {background:var(--bluui-surface-muted,#f5f4f7);font-size:12px;}
.web-api-table thead th:first-child {width:24%;}
.web-api-table thead th:nth-child(2) {width:43%;}
.web-api-table tbody th {font-weight:600;}
.web-api-table tr:last-child>* {border-bottom:0;}
.web-api-table code {white-space:pre-wrap;font-size:12px;}
.web-api-table small {display:block;font-size:11px;font-family:inherit;color:var(--bluui-text-muted,#595868);margin-top:5px;}
.web-api-table td:last-child {font-size:12px;color:var(--bluui-text-muted,#595868);}
.web-api-type {border:1px solid var(--bluui-border,#dddde5);border-radius:9px;background:var(--bluui-surface,#fff);margin-top:9px;overflow:hidden;}
.web-api-type summary {padding:14px 16px;font-size:13px;cursor:pointer;overflow-wrap:anywhere;}
.web-api-type p {padding:0 16px;font-size:13px;}
.web-api-type pre {margin:0;padding:16px;background:var(--bluui-surface-muted,#f5f4f7);white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.7;}
.web-api-source {display:flex;flex-wrap:wrap;gap:12px;align-items:center;font-size:12px;margin:24px 0;}
.web-api-source span {color:var(--bluui-text-muted,#595868);}
.api-edition-note {font-size:13px;}
[data-bluui-theme=dark] .component-tag--free {color:#ade5bd;background:#183422;border-color:#386347;}
@media(max-width:700px) {
 .api-platform-bar {align-items:stretch;flex-direction:column;padding:15px;}
 .api-platform-switch button {flex:1;}
 .web-api-table th,.web-api-table td {padding:10px 8px;}
 .web-api-table {table-layout:auto;min-width:550px;}
 .web-api-intro {flex-wrap:wrap;}
 .web-api-intro>div {flex:1;min-width:190px;}
 .web-api-intro h2 {font-size:23px;}
 .blu-page-header__actions .component-tags {width:100%;}
}

.web-api-type {scroll-margin-top:24px;}
.web-api-table a {color:var(--bluui-primary,#5941a0);text-underline-offset:3px;}
@media(prefers-color-scheme:dark){:root:not([data-bluui-theme=light]) .component-tag--free{color:#ade5bd;background:#183422;border-color:#386347;}}

/* Cascader menus must escape the short Code preview, while their own columns
   scroll within the available example width on narrow screens. Setting only
   overflow-x:auto also made overflow-y:auto and clipped the open picker. */
.web-preview:has(.blu-cascader) { overflow: visible; }
:is(#playground-demo, #examples-root, #web-preview) .blu-cascader { min-width: 0; }
:is(#playground-demo, #examples-root, #web-preview) .blu-cascader__popup { max-width: min(760px, 100%); }
