/* Bloque de código con pestañas y botón de copiar.
   ---------------------------------------------------------------------------
   Vivía dentro de `05-public-docs-a.css`, la hoja de la referencia pública.
   Sale aquí porque desde el 2026-08-05 lo usan dos páginas: esa y el diálogo
   «Ver código» del probador (`analytics.html`). Es el mismo reparto que hizo
   `code_tabs.js` con el comportamiento.

   No entra en el núcleo: solo dos páginas lo cargan, y el núcleo acaba de
   bajar de 29 módulos a 6 precisamente para que nadie descargue lo que no usa.
   Se carga por `page_styles` en las dos, que va DESPUÉS del núcleo y por tanto
   gana en la cascada con la misma especificidad.

   El 04 no es decorativo: va antes del 05 porque la referencia pública tiene
   dos variantes propias (`.api-copy--inline` y la del bloque de SDK) que
   colocan el botón de otra manera y tienen que ganarle a la base. */

.api-code-tabs { overflow: hidden; border-radius: 13px; background: #111a2d; color: #e5edf9; }
.api-code-tablist { display: flex; gap: 2px; padding: 8px 10px 0; border-bottom: 1px solid #29344a; }
.api-code-tablist button { padding: 9px 14px; border: 0; border-radius: 8px 8px 0 0; color: #94a6c2; background: transparent; cursor: pointer; }
.api-code-tablist button.is-active { color: white; background: #25334c; }
.api-code-panel { position: relative; display: none; overflow: auto; }
.api-code-panel.is-active { display: block; }
.api-code-panel pre { margin: 0; padding: 25px; max-height: 620px; overflow: auto; font: .84rem/1.65 ui-monospace, SFMono-Regular, Consolas, monospace; }
.api-copy { position: absolute; top: 13px; right: 13px; display: flex; gap: 6px; align-items: center; padding: 7px 9px; border: 1px solid #3a4862; border-radius: 7px; color: #b9c7da; background: #1d2940; cursor: pointer; }
.api-copy svg { width: 14px; }
.api-code-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 13px !important; font-size: .78rem; }
.api-code-note svg { width: 15px; flex: 0 0 auto; margin-top: 3px; color: #2778c7; }

/* El botón de copiar flota sobre el código, así que en pantallas estrechas se
   le hace sitio arriba en vez de dejarlo encima de la primera línea. */
@media (max-width: 720px) {
  .api-code-panel pre { padding: 58px 18px 20px; font-size: .76rem; }
}
