/* Loaded only by Pages/info/infos.php. Other site pages keep their layout. */
.server-info { min-width: 0; line-height: 1.65; }
.server-info section { scroll-margin-top: 100px; }
.server-info .server-info__nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.server-info .server-info__nav a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 14px; border: 1px solid var(--line-cool); border-radius: 9px; background: rgba(255,255,255,.025); color: #e2e3e8; font-size: 12px; font-weight: 700; text-decoration: none; }
.server-info .server-info__nav a:hover { color: var(--gold); border-color: var(--line); background: var(--gold-soft); }
.server-info a:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.server-info .server-info__section { margin-top: 30px; }
.server-info .server-info__section:first-of-type { margin-top: 0; }
.server-info .server-info__section > h3 { margin: 0 0 14px; }
.server-info .server-info__stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin: 0 0 16px; }
.server-info .server-info__stat { min-width: 0; padding: 15px; border: 1px solid var(--line-cool); border-radius: 12px; background: rgba(255,255,255,.025); }
.server-info .server-info__stat dt { color: #c2c4cd; font-size: 12px; line-height: 1.4; }
.server-info .server-info__stat dd { margin: 7px 0 0; color: #fff; font-family: Cinzel,Georgia,serif; font-size: 29px; font-weight: 700; line-height: 1.2; }
.server-info .server-info__stat:first-child { border-color: var(--line); background: var(--gold-soft); }
.server-info .server-info__stat:first-child dd { color: var(--gold); }
.server-info .server-info__classes { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.server-info .server-info__classes li { margin: 0; padding: 5px 10px; border: 1px solid var(--line-cool); border-radius: 7px; background: rgba(255,255,255,.02); font-size: 12px; }
.server-info .server-info__features { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.server-info .server-info__feature { min-width: 0; padding: 16px; border: 1px solid var(--line-cool); border-radius: 12px; background: rgba(255,255,255,.02); }
.server-info .server-info__feature h4 { margin: 0 0 7px; color: #f0e8d9; font-size: 14px; }
.server-info .server-info__feature p { margin: 0; font-size: 13px; }
.server-info .server-info__rankings { margin: 14px 0 0; font-size: 13px; }
.server-info .server-info__list { margin: 0; padding: 0; border: 1px solid var(--line-cool); border-radius: 12px; background: rgba(255,255,255,.02); overflow: hidden; }
.server-info .server-info__row { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 14px; align-items: start; margin: 0; padding: 13px 16px; border-bottom: 1px solid rgba(193,205,224,.09); }
.server-info .server-info__row:last-child { border-bottom: 0; }
.server-info .server-info__row dt, .server-info .server-info__row dd { min-width: 0; margin: 0; }
.server-info .server-info__row dd { padding-top: 2px; color: #c7c8ce; font-size: 13px; }
.server-info .server-info__row code, .server-info .server-info__row kbd { display: inline-block; max-width: 100%; padding: 3px 8px; border: 1px solid var(--line-cool); border-radius: 6px; background: rgba(255,255,255,.04); color: #f0e8d9; font-family: Consolas,monospace; font-size: 12px; font-weight: 600; line-height: 1.6; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.server-info .server-info__shortcuts .server-info__row { grid-template-columns: 70px minmax(0,1fr); }
.server-info .server-info__note { margin: 0 0 14px; font-size: 13px; }
@media (max-width: 1060px) {
    .server-info .server-info__stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .server-info .server-info__features { grid-template-columns: 1fr; }
    .server-info .server-info__row { grid-template-columns: 165px minmax(0,1fr); gap: 10px; }
}
@media (max-width: 880px) {
    /* This stylesheet is included only on the Information page. */
    .main_content > .centercontent { order: -1; min-width: 0; }
    .main_content > .leftcontent { order: 1; }
    .server-info .server-info__features { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
    .server-info { font-size: 14px; }
    .server-info .server-info__nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-bottom: 20px; }
    .server-info .server-info__nav a { padding: 8px 10px; }
    .server-info .server-info__stat { padding: 12px; }
    .server-info .server-info__stat dd { font-size: 27px; }
    .server-info .server-info__features { grid-template-columns: 1fr; gap: 10px; }
    .server-info .server-info__feature { padding: 14px; }
    .server-info .server-info__row { grid-template-columns: minmax(0,1fr); gap: 7px; padding: 13px; }
    .server-info .server-info__row dd { padding-top: 0; }
    .server-info .server-info__shortcuts .server-info__row { grid-template-columns: 52px minmax(0,1fr); gap: 10px; }
    .server-info .server-info__section { margin-top: 26px; }
}
@media (max-width: 380px) {
    .nav-chip { position: relative; gap: 0; }
    /* Keep the status text available to assistive technology in a compact header. */
    .nav-chip-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; }
}
