/*
 * PHPBB Lab shared layout and visual accessibility — 1.1.1.
 * Copyright (c) 2026 Michel Stassen / PHPBB Lab. GPL-2.0-only.
 * No zoom restriction, DOM reordering, page overflow masking or core changes.
 */
html { height: auto; }
body.lab-page,
body.lab-forum-page,
body.lab-academy-page {
    padding: 0;
    color: var(--lab-text);
    background: var(--lab-canvas);
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) *,
body:is(.lab-page, .lab-forum-page, .lab-academy-page) *::before,
body:is(.lab-page, .lab-forum-page, .lab-academy-page) *::after { box-sizing: border-box; }

/* Break long human-readable values; code and tables scroll locally below. */
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, legend, a, button, summary) {
    overflow-wrap: anywhere;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(main, section, article, nav, header, footer, form, fieldset, .inner, .content) { min-width: 0; }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(img, video, canvas) {
    max-width: 100%;
    height: auto;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(audio, iframe, object, embed) { max-width: 100%; }
.lab-forum-page .content,
.lab-academy-page .content { color: var(--lab-text); }
.lab-forum-page h1 { margin-inline-end: 0; }
.lab-page h1,
.lab-page h2,
.lab-page h3 { color: var(--lab-navy); }
.lab-forum-page :where(p, .postprofile, .postbody, .content),
.lab-academy-page p { overflow-wrap: anywhere; }
.lab-forum-page p { overflow: visible; }

/* All four main navigation links remain visible, in their original order. */
.lab-header .lab-nav-links a,
.lab-forum-toolbar .lab-nav-links a,
#nav-account a,
#nav-main a {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}
.lab-header .lab-nav-links li,
.lab-forum-toolbar .lab-nav-links li,
.lab-account,
.lab-forum-account,
.lab-forum-breadcrumbs,
.lab-forum-breadcrumbs ol,
.lab-forum-breadcrumbs li { min-width: 0; max-width: 100%; }
.lab-forum-breadcrumbs li { flex-wrap: wrap; }
.lab-forum-breadcrumbs li a { min-width: 0; }
.lab-forum-row-meta span { flex-wrap: wrap; gap: .25em; }
.lab-forum-brand,
.lab-forum-account-main { max-width: 100%; }
.lab-forum-tools-list { max-width: calc(100vw - 2rem); }

/* Native fields, including extension forms, remain legible and resizable. */
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(input, select, textarea, button) {
    max-width: 100%;
    font-family: inherit;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(input.inputbox, textarea, select, input[type="text"], input[type="email"], input[type="url"], input[type="search"], input[type="password"], input[type="number"], input[type="tel"], input[type="date"], input[type="file"]) {
    min-height: 2.75rem;
    padding: .55rem .65rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--lab-text);
    background: var(--lab-surface);
    border: 1px solid var(--lab-border-strong);
    border-radius: .3rem;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) textarea {
    min-height: 8rem;
    resize: vertical;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) input::placeholder,
body:is(.lab-page, .lab-forum-page, .lab-academy-page) textarea::placeholder { color: var(--lab-muted); opacity: 1; }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) input:focus::placeholder,
body:is(.lab-page, .lab-forum-page, .lab-academy-page) textarea:focus::placeholder { color: var(--lab-muted); opacity: 1; }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--lab-blue);
    width: 1.2em;
    height: 1.2em;
    vertical-align: middle;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(label, dd label, fieldset.quick-login label, fieldset.display-options label, fieldset.display-actions, fieldset.display-actions label, fieldset.jumpbox, legend) {
    max-width: 100%;
    white-space: normal;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) fieldset { min-inline-size: 0; }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) legend { box-sizing: border-box; }
.lab-forum-page fieldset label,
.lab-academy-page fieldset label,
.lab-forum-page fieldset.display-actions,
.lab-academy-page fieldset.display-actions { white-space: normal; }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(button, .button, a.button1, a.button2, input.button1, input.button2, input.button3) {
    min-height: 2.75rem;
    max-width: 100%;
    padding: .55rem .9rem;
    white-space: normal;
    line-height: 1.5;
    font-size: 1rem;
    border: 1px solid var(--lab-border-strong);
    border-radius: .35rem;
    color: var(--lab-blue);
    background: var(--lab-surface);
    background-image: none;
    box-shadow: none;
    text-shadow: none;
}
.lab-forum-page .button1,
.lab-forum-page a.button1,
.lab-forum-page input.button1,
.lab-academy-main .button1,
.lab-academy-main input.button1 {
    color: var(--lab-surface);
    background: var(--lab-blue);
    border-color: var(--lab-blue);
}
.lab-forum-page .button1:hover,
.lab-forum-page .button1:focus,
.lab-forum-page input.button1:hover,
.lab-forum-page input.button1:focus,
.lab-academy-main .button1:hover,
.lab-academy-main input.button1:hover {
    color: var(--lab-surface);
    background: var(--lab-navy);
    border-color: var(--lab-navy);
}
.lab-forum-page :where(.button, .button2, .button3):hover,
.lab-academy-page .button2:hover { color: var(--lab-navy); background: var(--lab-surface-soft); border-color: var(--lab-blue); }
.lab-forum-page .button .icon { color: currentColor; }
/* Small secondary icon controls retain usable 24px targets, not full CTA size. */
.lab-forum-page .post-buttons .button,
.lab-forum-page .contact-icons .button,
.lab-forum-page .pagination .button {
    min-width: 1.5rem;
    min-height: 1.5rem;
    padding: .25rem .4rem;
}
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :is(input, select, textarea, button):disabled,
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :is(.button, .button1, .button2, .button3)[aria-disabled="true"] {
    color: var(--lab-muted) !important;
    -webkit-text-fill-color: var(--lab-muted) !important;
    background: var(--lab-disabled-bg) !important;
    border-color: var(--lab-border-strong) !important;
    opacity: 1 !important;
    cursor: not-allowed;
}

/* Light inner ring + dark outer ring remain distinct on light/dark surfaces. */
body.lab-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible,
body.lab-forum-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible,
body.lab-academy-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--lab-navy);
    outline-offset: 3px;
    box-shadow: 0 0 0 3px var(--lab-surface);
}
.lab-forum-page .error,
.lab-academy-page .error { color: var(--lab-experimental); }
body:is(.lab-page, .lab-forum-page, .lab-academy-page) :is(input, select, textarea)[aria-invalid="true"] {
    border-color: var(--lab-experimental);
    border-width: 2px;
}
.lab-academy-main .successbox { color: var(--lab-stable); background: var(--lab-success-bg); border-color: var(--lab-stable); }
.lab-academy-main .errorbox { color: var(--lab-experimental); background: var(--lab-error-bg); border-color: var(--lab-experimental); }
.lab-forum-page .icon.icon-lightgray { color: var(--lab-muted); }

/* Colour-only group distinctions never take precedence over readability. */
.lab-forum-page .username-coloured,
.lab-academy-page .username-coloured { color: var(--lab-blue) !important; }
.lab-forum-page .syntaxbg { background: var(--lab-surface); }
.lab-forum-page .syntaxcomment { color: var(--lab-bronze); }
.lab-forum-page .syntaxdefault { color: var(--lab-blue); }
.lab-forum-page .syntaxhtml { color: var(--lab-text); }
.lab-forum-page .syntaxkeyword { color: var(--lab-teal); }
.lab-forum-page .syntaxstring { color: var(--lab-experimental); }
.lab-forum-page .content .highlight,
.lab-forum-page .content .highlight a { color: var(--lab-experimental); background: var(--lab-error-bg); }
.lab-forum-page .content .codebox p,
.lab-forum-page .notice,
.lab-forum-page .postbody .author,
.lab-forum-page .postprofile dd,
.lab-forum-page .attachbox :where(p, dd),
.lab-forum-page .signature { color: var(--lab-muted); }
.lab-forum-page .postprofile dd.profile-warnings { color: var(--lab-experimental); }
.lab-forum-page .postprofile dd { overflow: visible; text-overflow: clip; }
.lab-forum-page .ellipsis-text { white-space: normal; overflow: visible; text-overflow: clip; }
.lab-forum-page .tabs .tab > a,
.lab-forum-page .minitabs .tab > a { white-space: normal; }
.lab-forum-page.nojs .tabs a span,
.lab-forum-page.nojs .minitabs a span { max-width: none; overflow: visible; text-overflow: clip; letter-spacing: normal; }
.lab-forum-page fieldset.polls dl { color: var(--lab-muted); }
.lab-forum-page :where(option.disabled-option, input.disabled) { color: var(--lab-muted); }
.lab-forum-page :where(.pm_message_reported_colour) { border-color: var(--lab-experimental); }
.lab-forum-page :where(.pm_marked_colour) { border-color: var(--lab-bronze); }
.lab-forum-page :where(.pm_replied_colour, .pm_friend_colour, .pm_foe_colour) { border-color: var(--lab-border-strong); }
.lab-forum-page table.table1 thead th { color: var(--lab-surface); background: var(--lab-navy); }
.lab-forum-page table.table1 thead th a { color: var(--lab-surface); }
.lab-forum-page .forabg li.header dt,
.lab-forum-page .forumbg li.header dt,
.lab-forum-page .forabg .header a,
.lab-forum-page .forumbg .header a { color: var(--lab-navy); }
.lab-forum-page .jumpbox-forum-link:hover,
.lab-forum-page .jumpbox-sub-link:hover { color: var(--lab-blue); }
.lab-forum-page .pagination li.active span { color: var(--lab-surface); }
.lab-forum-page .pagination li a:hover,
.lab-forum-page .pagination li a:hover .icon { color: var(--lab-surface); }

/* Last-post links, topic counts and moderation marks must not disappear.
 * Only forum totals already repeated by lab-forum-row-meta are hidden.
 */
.lab-forum-page li.row dl.row-item { display: flex; flex-wrap: wrap; position: relative; }
.lab-forum-page li.row dl.row-item dt { flex: 1 1 100%; float: none; margin: 0; min-width: 0; }
.lab-forum-page li.row dl.row-item dt .list-inner.with-mark { padding-inline-end: 2.75rem; }
.lab-forum-page li.row dd:not(.mark) {
    display: block;
    float: none;
    width: auto;
    min-width: 0;
    max-width: 100%;
    min-height: 0;
    padding: 0 1rem 1rem;
    border: 0;
    color: var(--lab-muted);
}
.lab-forum-page li.row dd.lastpost { flex: 1 1 100%; }
.lab-forum-page ul.forums li.row dd.topics,
.lab-forum-page ul.forums li.row dd.posts,
.lab-forum-page ul.forums li.row dd.redirect { display: none; }
.lab-forum-page li.row dd.mark { display: block; }
.lab-forum-page li.row dd:not(.mark) dfn { position: static; display: inline; width: auto; font-weight: 600; }
.lab-forum-page ul.topiclist li.row dt a.subforum { max-width: 100%; overflow: visible; text-overflow: clip; }

/* Shared extensions can inject language controls outside the page body. */
.lab-forum-page .panel[data-phpbblab-no-auto-translate]:not([data-phpbblab-page-translate-control]) form { flex-wrap: wrap; }
.lab-forum-page .panel[data-phpbblab-no-auto-translate]:not([data-phpbblab-page-translate-control]) label,
.lab-forum-page .panel[data-phpbblab-no-auto-translate]:not([data-phpbblab-page-translate-control]) button,
.lab-forum-page .panel[data-phpbblab-page-translate-control] button,
.lab-forum-page .panel[data-phpbblab-no-auto-translate] select {
    font-size: 1rem;
    white-space: normal;
    min-height: 2.75rem;
    line-height: 1.5;
}
.lab-forum-page .panel[data-phpbblab-no-auto-translate]:not([data-phpbblab-page-translate-control]) select,
.lab-forum-page .phpbblab-international-language-form select { min-width: 0; max-width: 100%; }
.lab-forum-page .panel[data-phpbblab-no-auto-translate] select { border-color: var(--lab-border-strong); }

/* Dense factual/code content: horizontal scrolling is local, never page-wide. */
.lab-forum-page .codebox,
.lab-academy-page .codebox,
.lab-forum-page pre,
.lab-academy-page pre { min-width: 0; max-width: 100%; }
.lab-forum-page .codebox code,
.lab-forum-page pre { overflow: auto; }
.lab-forum-page table.table1,
.lab-academy-page table.table1 { width: 100%; overflow-wrap: anywhere; }
.lab-forum-page table.table1 :where(td, th),
.lab-academy-page table.table1 :where(td, th) { white-space: normal; }
.lab-forum-page .pagination,
.lab-forum-page .action-bar { max-width: 100%; }
.lab-forum-page .pagination ul { display: inline-flex; flex-wrap: wrap; gap: .2rem; }
.lab-forum-page .pagination li a,
.lab-forum-page .pagination li span { line-height: 1.5; min-width: 1.5rem; }
.lab-forum-page .action-bar .search-box { max-width: 100%; }
.lab-forum-page .search-box .inputbox { height: auto; min-height: 2.75rem; }
.lab-forum-page .search-box .button { min-height: 2.75rem; }
body:is(.lab-forum-page, .lab-academy-page) .phpbb_alert {
    width: min(40rem, calc(100% - 2rem));
    margin-inline: 0;
    left: 50%;
    right: auto;
    top: 1rem;
    transform: translateX(-50%);
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    overflow: auto;
    color: var(--lab-text);
    background: var(--lab-surface);
    border-color: var(--lab-border-strong);
}
body:is(.lab-forum-page, .lab-academy-page) .phpbb_alert .alert_close {
    margin: .5rem 0;
    min-width: 1.5rem;
    min-height: 1.5rem;
}
.lab-forum-page .dropdown .dropdown-contents { max-width: calc(100vw - 2rem); }
.lab-forum-page .dropdown-extended .dropdown-contents { width: min(24rem, calc(100vw - 2rem)); }
/* Cookie controls are generated by phpBB; preserve explicit light/dark pairs. */
body:is(.lab-forum-page, .lab-academy-page) .cc-window { color: var(--lab-surface); background: var(--lab-blue); line-height: 1.5; }
body:is(.lab-forum-page, .lab-academy-page) .cc-window .cc-link { color: var(--lab-surface); opacity: 1; }
body:is(.lab-forum-page, .lab-academy-page) .cc-window .cc-btn { color: var(--lab-blue); background: var(--lab-surface); border: 2px solid var(--lab-surface); white-space: normal; }

@media (max-width: 48rem) {
    .lab-forum-page fieldset :where(dt, dd),
    .lab-academy-page fieldset :where(dt, dd) { float: none; width: auto; margin-inline: 0; }
    .lab-forum-page fieldset dt,
    .lab-academy-page fieldset dt { margin-bottom: .35rem; }
    .lab-forum-page .column1,
    .lab-forum-page .column2 { float: none; width: 100%; margin-inline: 0; }
    .lab-forum-page .action-bar .search-box { float: none; clear: both; padding-block: .5rem; }
    .lab-forum-page .cp-main,
    .lab-forum-page .cp-menu { float: none; width: 100%; margin-inline: 0; }
    .lab-forum-page fieldset.quick-login input.inputbox { width: min(100%, 24rem); }
    /* Keep account tools next to their trigger even with a mobile keyboard. */
    .lab-forum-tools-list { position: static; width: 100%; max-width: 100%; max-height: none; margin-top: .5rem; }
    .lab-forum-tools { max-width: 100%; }
}
@media (max-width: 30rem) {
    .lab-header-inner,
    .lab-main,
    .lab-academy-main,
    .lab-footer-inner,
    .lab-forum-masthead-inner,
    .lab-forum-toolbar-inner,
    .lab-forum-page #page-body { width: calc(100% - 2rem); }
    .lab-forum-page .postbody,
    .lab-forum-page .postprofile { width: 100%; float: none; min-width: 0; }
    .lab-forum-page .postprofile { min-height: 0; }
    .lab-forum-page .post .postprofile { overflow: visible; }
    .lab-forum-page .postprofile dd { display: block; }
    .lab-forum-page .postbody h3 { margin-inline-end: 0; }
    .lab-forum-page .post-buttons { position: static; float: none; }
}
@media (forced-colors: active) {
    body.lab-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible,
    body.lab-forum-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible,
    body.lab-academy-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline-color: Highlight; box-shadow: none; }
    body:is(.lab-page, .lab-forum-page, .lab-academy-page) :where(input, select, textarea, button, .button, .button1, .button2, .lab-button) { forced-color-adjust: auto; border-color: ButtonText; }
    body:is(.lab-page, .lab-forum-page, .lab-academy-page) :is(input, select, textarea, button):disabled { color: GrayText !important; -webkit-text-fill-color: GrayText !important; border-color: GrayText !important; background: Canvas !important; }
}
@media (prefers-reduced-motion: reduce) {
    body:is(.lab-page, .lab-forum-page, .lab-academy-page),
    body:is(.lab-page, .lab-forum-page, .lab-academy-page) * {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        transition-delay: 0s !important;
    }
}