/* Keep API data inside the established prototype's page and card rhythm. */
#dialog-title:focus { outline: none; }
.api-library-page .page-heading { margin: 0; }
.api-library-page .esim-page-top { margin-bottom: 24px; }
.api-library-page .api-esim-tabs { display: flex; flex-wrap: wrap; padding: 0; border: 0; background: transparent; gap: 8px; max-width: none; margin: 24px 0 12px; }
.api-library-page .api-esim-tabs button { flex-direction: row; min-height: 46px; padding: 10px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); color: var(--ink-soft); }
.api-library-page .api-esim-tabs button[aria-selected=true] { border-color: var(--orange); background: var(--orange-light); color: var(--orange-dark); box-shadow: inset 0 0 0 1px var(--orange); }
.api-library-card { background: white; border-radius: 22px; }
.api-library-card .api-library-card-bottom { color: white; border: 0; padding: 14px 18px; margin-top: auto; }
.api-library-page .api-history-toolbar { margin: 0 0 20px; }
.api-library-page .api-history-toolbar>span { font-size: 12px; }
.api-library-page .api-history-toolbar .button { padding: 8px 12px; min-height: 44px; font-size: 12px; }
.api-library-page .add-esim { display: flex; width: fit-content; margin: 28px auto 0; }
@media(max-width:640px) {
  .api-library-page .api-esim-tabs { display: grid; grid-template-columns: 1.35fr .8fr 1fr; gap: 5px; }
  .api-library-page .api-esim-tabs button { padding: 8px 5px; gap: 4px; font-size: 10px; border-radius: 10px; }
  .api-library-page .api-esim-tabs button>span { min-height: 0; }
  .api-library-page .api-esim-tabs button b { min-width: 18px; height: 20px; font-size: 10px; }
  .api-library-card { border-radius: 16px; padding: 21px; }
  .api-library-card h2 { font-size: 19px; }
  .api-library-card .api-library-card-bottom { font-size: 12px; }
}