.blog_blog .leading {
  margin-top: 40px;
  text-align: justify;
}
@media screen and (max-width: 480px) {
  .blog_blog .leading {
    text-align: left;
  }
}
.blog_blog .leading.leading-0 {
  margin-top: 10px;
}
.blog_blog .leading.leading-30 {
  margin-bottom: 30px;
}
.blog_blog .leading .article-header {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--twoip-outline-variant);
  margin-bottom: 10px;
}
.blog_blog .leading .article-intro {
  margin-bottom: -5px;
}
.blog_blog .items-leading .leading,
.blog_blog .items-row .item {
  margin-bottom: 24px;
}
.blog_blog article {
  display: flow-root;
}
.blog_blog .article-title {
  overflow-wrap: anywhere;
}
.blog_blog .readmore {
  margin-top: 12px;
}
.item-page_blog h1.article-title {
  font-size: 150% !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--twoip-outline-variant);
  margin-bottom: 10px !important;
  font-weight: bold;
}
.item-page_blog .article-content {
  text-align: justify;
}
@media screen and (max-width: 480px) {
  .item-page_blog .article-content {
    text-align: left;
  }
}
.item-page_blog .article-content .helpservice {
  margin-bottom: 15px;
}
.item-page_blog .article-content .helpservice .twoip-icon {
  top: 1px;
}

.item-page_cabinet .addapi .twoip-icon {
  color: var(--twoip-primary);
}
.item-page_cabinet .twoip-form-horizontal {
  margin-bottom: 15px;
}
/* Cabinet modals move to body, outside .item-page_cabinet. */
.item-page_cabinet .twoip-form-horizontal .twoip-form-group,
.twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group {
  margin: 0;
  padding: 0;
}
.item-page_cabinet table td.ellipsis {
  max-width: 125px;
}
.item-page_cabinet .cabinet-provider-text {
  overflow-wrap: normal;
  word-break: normal;
}
.item-page_cabinet .cabinet-provider-actions {
  white-space: nowrap;
  width: 1%;
}
.item-page_cabinet .cabinet-provider-actions .modal {
  white-space: normal;
}
/* Keep cabinet headings together when their labels wrap on narrow screens. */
@media screen and (max-width: 767px) {
  .item-page_cabinet {
    min-width: 0;
  }
  .item-page_cabinet .article-content > .row > .collapse {
    min-width: 0;
  }
  .item-page_cabinet .collapse .table-responsive {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .item-page_cabinet .collapse .table-responsive > .table:not([data-api-management-table], [data-api-trial-table]) {
    min-width: 620px;
  }
  .item-page_cabinet #api .tab-pane .table-responsive > .table:not([data-api-management-table]) {
    min-width: 900px;
  }
  .item-page_cabinet #tabs-1 .table-responsive td:first-child,
  .item-page_cabinet #tabs-1 .table-responsive td:nth-child(3),
  .item-page_cabinet #tabs-1 .table-responsive td:nth-child(5),
  .item-page_cabinet #tabs-2 .table-responsive td:first-child,
  .item-page_cabinet #tabs-2 .table-responsive td:nth-child(3),
  .item-page_cabinet #tabs-2 .table-responsive td:nth-child(5),
  .item-page_cabinet #tabs-3 .table-responsive td:first-child,
  .item-page_cabinet #tabs-3 .table-responsive td:nth-child(5),
  .item-page_cabinet #tabs-3 .table-responsive td:nth-child(6) {
    white-space: nowrap;
  }
  .item-page_cabinet #tabs-3 .table-responsive .result-credential-action {
    min-height: 44px;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
  }
  .item-page_cabinet .collapse .twoip-form-horizontal > .twoip-form-group {
    margin-bottom: 12px;
  }
  .item-page_cabinet .collapse .form-control {
    width: 100%;
    max-width: 100%;
  }
  .item-page_cabinet #add-speedtest-api .form-control {
    min-height: 44px;
  }
  .item-page_cabinet #speedtest-new-date::-webkit-date-and-time-value {
    min-height: 1.5em;
  }
  .item-page_cabinet .btn {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .item-page_cabinet .collapse > .text-center > .btn {
    display: block;
    width: 100%;
  }
  .item-page_cabinet .collapse > .twoip-form-horizontal > .twoip-form-group.text-center > .btn {
    width: 100%;
  }
  .item-page_cabinet #addapi > .twoip-form-group.text-center > .btn {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .modal[id^="editapi-"] .modal-dialog {
    display: block;
    width: calc(100% - 20px);
    margin: 10px auto;
  }
  .modal[id^="editapi-"] .modal-content {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 20px);
    overflow: hidden;
  }
  .modal[id^="editapi-"] .modal-body {
    min-height: 0;
    overflow-y: auto;
  }
  .modal[id^="editapi-"] .modal-footer {
    flex-shrink: 0;
  }
}

.item-page_cabinet table th {
  word-break: normal;
  overflow-wrap: normal;
}
.item-page_cabinet .twoip-cabinet-status {
  min-width: 12ch;
}

.item-page_cabinet .twoip-cabinet-heading {
  max-width: 100%;
}
/* Rows share one label/control grid, including modals relocated to body. */
.twoip-form-horizontal[action^="/service/account/admin/data/"] {
  --twoip-cabinet-label-width: 25%;
}
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px 16px;
  margin-block-end: var(--twoip-form-support-gap, 8px);
  align-items: center;
}
/* Legacy clearfix pseudo-elements must not participate as grid children. */
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label)::before,
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label)::after {
  content: none;
}
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group > :is(label,.twoip-current-grid) {
  width: auto;
  min-width: 0;
  float: none;
  padding: 0;
}
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group > label {
  position: static;
  grid-column: 1;
  grid-row: 1;
  text-align: start;
  word-break: normal;
  overflow-wrap: normal;
}
@media (min-width: 992px) {
  body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label) {
    grid-template-columns: minmax(0, var(--twoip-cabinet-label-width)) minmax(0, 1fr);
  }
  body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group > .twoip-current-grid:not(label) {
    grid-column: 2;
    grid-row: 1;
  }
  body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group > label {
    text-align: end;
  }
  body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-cabinet-form-actions {
    margin-inline-start: calc(var(--twoip-cabinet-label-width) + 16px);
  }
}

body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label) .form-control {
  margin-block: 0;
}

/* Multiline editors keep their label at the start of the text area. */
body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group:has(> label):has(textarea) {
  align-items: start;
}

@media (max-width: 991px) {
  body .twoip-form-horizontal[action^="/service/account/admin/data/"] > .twoip-form-group > .twoip-current-grid:not(label) {
    grid-column: 1;
    grid-row: 2;
  }
}

/* Connection monitoring metadata shares one axis, including the native switch. */
.account .twoip-monitor-metadata {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 12px 24px;
  padding-block: 6px;
}
.account .twoip-monitor-metadata-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.account .twoip-monitor-metadata-item > .twoip-icon {
  position: static;
  flex-shrink: 0;
  margin: 0;
}
@media (min-width: 1024px) {
  .account .twoip-monitor-metadata {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Blog media retains its aspect ratio within the allocated article column. */
.blog_blog img { max-inline-size: 100%; block-size: auto; }

/* Only the history chart caption wraps; numeric data and action hit areas retain their metrics. */
.speed-history-chart-heading { display: inline-block; max-inline-size: 12ch; white-space: normal; }

.speed-history-fit-column { width: 1%; }

/* History captions share the cell axis; equal arrow slots keep sorting neutral. */
#speedtable { --twoip-history-sort-slot: 20px; }
/* Required only here to override the shared left-axis !important contract. */
#speedtable > :is(thead,tbody) > tr > :is(th,td) { text-align: var(--twoip-cabinet-date-align, center) !important; padding-inline: var(--twoip-space-1, 4px); }
#speedtable .dt-column-header.twoip-sort-control {
  display: inline-grid;
  grid-template-columns: var(--twoip-history-sort-slot) max-content var(--twoip-history-sort-slot);
  column-gap: 0;
  align-items: center;
}
#speedtable .dt-column-header.twoip-sort-control::before { content: ''; grid-column: 1; }
#speedtable .dt-column-title { grid-column: 2; }
#speedtable .dt-column-order { grid-column: 3; justify-self: end; }
#speedtable tbody tr:has(> td.twoip-action-cell) > td:not(:nth-child(6)) { white-space: nowrap; }

/* Provider names use their allocated column instead of inflating the table. */
#speedtable tbody tr:has(> td.twoip-action-cell) > td:nth-child(6) { white-space: normal; overflow-wrap: anywhere; }

/* Shared separation from history pagination; session actions retain their spacing. */
.account .twoip-account-actions--history {
  --twoip-history-actions-gap: 12px;
  margin-block-start: var(--twoip-history-actions-gap);
}

/* Cabinet date columns keep one mobile axis, including their time line. */
@media (max-width: 767px) {
  body .account table :is(th,td).twoip-cabinet-date { --twoip-cabinet-date-align: left; text-align: left !important; }
  body .account table .twoip-cabinet-date .twoip-date-time { text-align: inherit; }
  body .account table .twoip-cabinet-date .twoip-monitor-value { justify-content: flex-start; }
  body .account table th.twoip-cabinet-date .dt-column-header { display: flex; justify-content: flex-start; }
  body .account table th.twoip-cabinet-date .dt-column-header::before { content: none; }
}


/* API record sets retain the original cabinet row, type and action geometry. */
body .dt-bootstrap5 table.dataTable[data-api-management-table] { table-layout: auto; inline-size: 100%; }
body table[data-api-management-table] {
  --twoip-api-action-count: 1;
  --twoip-api-action-gap: var(--twoip-space-2, 8px);
}
body table[data-api-action-count="2"] { --twoip-api-action-count: 2; }
body table[data-api-action-count="3"] { --twoip-api-action-count: 3; }
body table[data-api-management-table] th[data-cabinet-action] {
  width: calc(var(--twoip-api-action-count) * var(--twoip-icon-action-size) + (var(--twoip-api-action-count) - 1) * var(--twoip-api-action-gap) + 2 * var(--twoip-table-cell-padding-inline));
}
body table[data-api-management-table] .twoip-api-actions {
  display: inline-flex; align-items: center; gap: var(--twoip-api-action-gap); white-space: nowrap;
}
body table[data-api-management-table] .twoip-api-actions > form { display: inline-flex; margin: 0; }
body table[data-api-management-table] span.twoip-truncate { display: block; }

/* Full owner credentials wrap within their allocated visible column. */
body table[data-api-management-table] .twoip-api-key {
  display: block; white-space: normal; overflow-wrap: anywhere;
  line-height: calc(var(--twoip-icon-action-size) / 2);
}
body table[data-api-management-table][data-cabinet-table^="speedtest-"]:not(.collapsed) th.twoip-api-key-cell { width: 32%; }
/* A block flex status has no inline baseline gap inside date cells. */
body table[data-api-management-table] .twoip-api-expiration > [data-twoip-cabinet-status] {
  display: flex; align-items: center; justify-content: center;
}
body .account table[data-api-management-table] .twoip-api-expiration .twoip-status-icon {
  margin: 0; position: static;
}

/* API editors opt into shared compact form rhythm without changing field geometry. */
.twoip-api-edit { --twoip-form-gap: var(--twoip-service-form-control-gap); }
.twoip-api-create {
  --twoip-form-gap: var(--twoip-service-form-control-gap);
  margin: 0;
}
.twoip-api-create > h4 { margin: 0; }
/* The shared collapse flow-root must not replace these forms' opt-in grid. */
body .account form.twoip-api-create:is(.collapse.show,.collapsing) { display: grid; }

/* API management owns a centered cell axis, including mobile date and numeric cells. */
body .account table.table[data-api-management-table] > :is(thead,tbody) > tr > :is(th,td) {
 text-align: center !important; vertical-align: middle;
}
body .dt-bootstrap5 table.dataTable[data-api-management-table] thead th .dt-column-header {
 display: inline-flex; justify-content: center; align-items: center; vertical-align: middle;
}

body table[data-api-trial-table] :is(th, td) { text-align: center; vertical-align: middle; }

/* Cabinet text borders follow the caption, including its bounded ellipsis. */
body .t3-content .account .twoip-inline-link:not(.twoip-inline-link--with-label),
body .t3-content .account .twoip-inline-link .twoip-inline-label:not(:has(.twoip-inline-label)) {
  display: inline-block;
  inline-size: fit-content;
  max-inline-size: 100%;
  min-inline-size: 0;
  flex: 0 1 auto;
}

/* API creation owns the trigger/form/table rhythm, including a collapsed form. */
.twoip-api-create-panel {
  display: grid; gap: var(--twoip-service-form-control-gap); min-inline-size: 0;
  padding-block-end: var(--twoip-service-form-control-gap);
}
/* One cabinet tab layout; the shared MD3 skin still owns states and controls. */
body .item-page_cabinet :is(.nav.nav-tabs,.nav.nav-pills,.twoip-tabs):not(.twoip-tabs--choice) {
  --twoip-account-tab-inline-size: 140px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--twoip-space-3, 12px);
}
body .item-page_cabinet :is(.nav.nav-tabs,.nav.nav-pills,.twoip-tabs):not(.twoip-tabs--choice) > :is(li,.nav-item,.twoip-tab) {
  flex: 0 0 var(--twoip-account-tab-inline-size);
  max-inline-size: 100%;
}

/* Opt-in equal-width groups reuse the shared MD3 tab skin and interactions. */
body .item-page_cabinet .nav.nav-tabs.twoip-account-tabs--full {
  display: grid; inline-size: 100%; text-align: center; grid-template-columns: none;
  grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);
}
@media (max-width: 576px) {
  body .item-page_cabinet .nav.nav-tabs.twoip-account-tabs--full {
    --twoip-tab-font-size: var(--twoip-type-label);
    gap: var(--twoip-space-2, 8px);
  }
  body .item-page_cabinet .nav.nav-tabs.twoip-account-tabs--full > li > .nav-link {
    flex-direction: column; gap: var(--twoip-space-1, 4px);
    padding-inline: var(--twoip-space-1, 4px);
  }
}