/*
 * The ManaForge phpBB presentation layer.
 *
 * Keep brand-specific styling here so the bundled prosilver stylesheets can
 * stay aligned with upstream phpBB during upgrades.
 */

:root {
    --tmf-bg: #1b1b1b;
    --tmf-surface: #242424;
    --tmf-surface-raised: #2a2a2a;
    --tmf-surface-hover: #313131;
    --tmf-surface-soft: #202020;
    --tmf-border: #444444;
    --tmf-border-soft: #383838;
    --tmf-text: #e5e5e5;
    --tmf-text-muted: #b4b4b4;
    --tmf-accent: #f05454;
    --tmf-accent-hover: #ff7474;
    --tmf-accent-strong: #a93636;
    --tmf-focus: #ff9a9a;
    --tmf-danger-bg: #4a2429;
    --tmf-warning-bg: #4a3d24;
    --tmf-success-bg: #243d2a;
    --tmf-radius: 8px;
    --tmf-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
    --tmf-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

html {
    background: var(--tmf-bg);
}

body {
    margin: 0;
    padding: 0;
    background: var(--tmf-bg);
    color: var(--tmf-text);
    font-family: var(--tmf-font);
    font-size: 14px;
}

body,
h1,
h2,
h3,
h4,
fieldset,
input,
button,
select,
select optgroup option,
textarea,
.button,
.content,
.content p,
.postbody,
.postbody h3,
.postprofile,
p.author,
.notice,
dl.faq,
.attachbox dt,
dl.file,
dl.file dt,
dl.thumbnail dd,
fieldset.polls,
fieldset.polls dd div,
.message-box textarea,
.dropdown-extended .header,
.notification_list p.notifications_title,
a.forumtitle,
a.topictitle,
a.button1,
input.button1,
input.button3,
a.button2,
input.button2,
li.header dt,
li.header dd,
.pagination li.active span {
    font-family: var(--tmf-font);
}

a {
    color: var(--tmf-accent);
}

a:hover {
    color: var(--tmf-accent-hover);
    text-decoration: underline;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.button:focus-visible {
    outline: 3px solid var(--tmf-focus);
    outline-offset: 2px;
}

/* Global ManaForge shell -------------------------------------------------- */

.tmf-skip-link {
    position: fixed;
    z-index: 2000;
    top: 8px;
    left: 8px;
    padding: 10px 14px;
    border-radius: 5px;
    background: #ffffff;
    color: #111111;
    font-weight: 700;
    text-decoration: none;
    transform: translateY(-160%);
    transition: transform 0.15s ease;
}

.tmf-skip-link:focus {
    color: #111111;
    transform: translateY(0);
}

.tmf-forum-hero {
    width: 100%;
    overflow: hidden;
    background: #111111;
    line-height: 0;
}

.tmf-forum-hero-link,
.tmf-forum-hero img {
    display: block;
    width: 100%;
}

.tmf-forum-hero-link:focus-visible {
    position: relative;
    z-index: 1;
    outline: 4px solid var(--tmf-focus);
    outline-offset: -4px;
}

.tmf-forum-hero img {
    height: auto;
    aspect-ratio: 1800 / 425;
    object-fit: cover;
}

.tmf-global-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px 0;
    background-color: #2d2d2d;
    background-image: linear-gradient(to bottom, #4a4a4a 0%, #1f1f1f 2px, #2d2d2d 92px, #2d2d2d 100%);
    background-repeat: repeat-x;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

.tmf-global-nav a {
    margin: 0 20px;
    padding: 0;
    border-radius: 0;
    color: #dcdcdc;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: normal;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
}

.tmf-global-nav a:hover,
.tmf-global-nav a:focus-visible {
    background: transparent;
    color: var(--tmf-accent);
    text-decoration: none;
    transform: scale(1.1);
}

/* Main forum frame ------------------------------------------------------- */

.wrap {
    max-width: 1200px;
    margin: 28px auto;
    padding: 22px;
    border: 1px solid var(--tmf-border-soft);
    border-radius: 10px;
    background: var(--tmf-surface-raised);
    box-shadow: var(--tmf-shadow);
    color: var(--tmf-text);
    font-size: 13px;
}

.page-body,
.page-footer {
    color: var(--tmf-text);
}

h2,
h3,
.memberlist-title {
    color: var(--tmf-accent-hover);
}

h3 {
    border-bottom-color: var(--tmf-border);
}

hr {
    border-color: var(--tmf-border);
    border-top-color: var(--tmf-border);
}

.headerbar {
    min-height: 36px;
    margin-bottom: 10px;
    padding: 8px;
    border: 1px solid var(--tmf-border-soft);
    border-radius: var(--tmf-radius);
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

.navbar {
    border: 1px solid var(--tmf-border-soft);
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

ul.navlinks {
    border-top-color: var(--tmf-border);
}

.breadcrumbs .crumb::before {
    color: var(--tmf-text-muted);
}

.navbar a,
.navbar .icon,
.linklist a,
.pagination a {
    color: var(--tmf-text);
}

.navbar a:hover,
.linklist a:hover,
.pagination a:hover {
    color: var(--tmf-accent-hover);
}

.postlink,
.postlink:visited {
    border-bottom-color: var(--tmf-accent);
    color: var(--tmf-accent-hover);
}

.postlink:hover {
    background: transparent;
    color: #ffffff;
}

/* Residual prosilver states --------------------------------------------- */

.forumbg .header a:hover,
.forabg .header a:hover,
th a:hover,
.arrow-left:hover,
.arrow-right:hover {
    color: var(--tmf-accent-hover);
}

.dropdown-extended a.mark_read {
    background-color: var(--tmf-surface-hover);
}

.post:target .content {
    color: var(--tmf-text);
}

.post h3 a.first-unread,
.post:target h3 a {
    color: var(--tmf-accent-hover);
}

.icon.icon-bluegray,
a:hover .icon.icon-bluegray {
    color: var(--tmf-text-muted);
}

.icon.icon-black,
a:hover .icon.icon-black {
    color: var(--tmf-text);
}

.sep {
    color: var(--tmf-accent);
}

.jumpbox .dropdown li {
    border-top-color: var(--tmf-border-soft);
}

.jumpbox-cat-link,
.jumpbox-cat-link:hover {
    border-top-color: var(--tmf-accent-strong);
    background: var(--tmf-accent-strong);
    color: #ffffff;
}

.jumpbox-forum-link,
.jumpbox-sub-link {
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

.jumpbox-forum-link:hover,
.jumpbox-sub-link:hover {
    background: var(--tmf-surface-hover);
    color: #ffffff;
}

.jumpbox .dropdown .pointer-inner {
    border-color: var(--tmf-surface) transparent;
}

/* ManaForge forum/topic status icons ----------------------------------- */

/*
 * phpBB's upstream GIF status icons remain untouched. The custom
 * TheManaforge style suppresses those backgrounds and renders a compact
 * professional ManaForge status sprite. The 448x256 source uses 64x64 cells
 * and is displayed at 40x40 CSS pixels for sharp high-DPI rendering.
 */
dl.row-item {
    position: relative;
    background-image: none !important;
}

.forum_read::before,
.forum_unread::before,
.forum_read_locked::before,
.forum_unread_locked::before,
.forum_read_subforum::before,
.forum_unread_subforum::before,
.forum_link::before,
.topic_read::before,
.topic_read_mine::before,
.topic_unread::before,
.topic_unread_mine::before,
.topic_read_locked::before,
.topic_read_locked_mine::before,
.topic_unread_locked::before,
.topic_unread_locked_mine::before,
.topic_read_hot::before,
.topic_read_hot_mine::before,
.topic_unread_hot::before,
.topic_unread_hot_mine::before,
.topic_moved::before,
.sticky_read::before,
.sticky_read_mine::before,
.sticky_unread::before,
.sticky_unread_mine::before,
.sticky_read_locked::before,
.sticky_read_locked_mine::before,
.sticky_unread_locked::before,
.sticky_unread_locked_mine::before,
.announce_read::before,
.announce_read_mine::before,
.announce_unread::before,
.announce_unread_mine::before,
.announce_read_locked::before,
.announce_read_locked_mine::before,
.announce_unread_locked::before,
.announce_unread_locked_mine::before,
.global_read::before,
.global_read_mine::before,
.global_unread::before,
.global_unread_mine::before,
.global_read_locked::before,
.global_read_locked_mine::before,
.global_unread_locked::before,
.global_unread_locked_mine::before {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 6px;
    width: 40px;
    height: 40px;
    content: "";
    pointer-events: none;
    transform: translateY(-50%);
    background-image: url("./images/tmf-forum-status-icons-v2.png");
    background-repeat: no-repeat;
    background-size: 280px 160px;
}

.forum_read::before { background-position: 0 0; }
.forum_unread::before { background-position: -40px 0; }
.forum_read_locked::before { background-position: -80px 0; }
.forum_unread_locked::before { background-position: -120px 0; }
.forum_read_subforum::before { background-position: -160px 0; }
.forum_unread_subforum::before { background-position: -200px 0; }
.forum_link::before { background-position: -240px 0; }

.topic_read::before,
.topic_read_mine::before { background-position: 0 -40px; }

.topic_unread::before,
.topic_unread_mine::before { background-position: -40px -40px; }

.topic_read_locked::before,
.topic_read_locked_mine::before { background-position: -80px -40px; }

.topic_unread_locked::before,
.topic_unread_locked_mine::before { background-position: -120px -40px; }

.topic_read_hot::before,
.topic_read_hot_mine::before { background-position: -160px -40px; }

.topic_unread_hot::before,
.topic_unread_hot_mine::before { background-position: -200px -40px; }

.topic_moved::before { background-position: -240px -40px; }

.sticky_read::before,
.sticky_read_mine::before { background-position: 0 -80px; }

.sticky_unread::before,
.sticky_unread_mine::before { background-position: -40px -80px; }

.sticky_read_locked::before,
.sticky_read_locked_mine::before { background-position: -80px -80px; }

.sticky_unread_locked::before,
.sticky_unread_locked_mine::before { background-position: -120px -80px; }

.announce_read::before,
.announce_read_mine::before { background-position: -160px -80px; }

.announce_unread::before,
.announce_unread_mine::before { background-position: -200px -80px; }

.announce_read_locked::before,
.announce_read_locked_mine::before { background-position: -240px -80px; }

.announce_unread_locked::before,
.announce_unread_locked_mine::before { background-position: 0 -120px; }

.global_read::before,
.global_read_mine::before { background-position: -40px -120px; }

.global_unread::before,
.global_unread_mine::before { background-position: -80px -120px; }

.global_read_locked::before,
.global_read_locked_mine::before { background-position: -120px -120px; }

.global_unread_locked::before,
.global_unread_locked_mine::before { background-position: -160px -120px; }

li.row dl.row-item dt .list-inner {
    padding-left: 58px;
}

li.row dl.row-item dt,
li.row dl.row-item dd {
    min-height: 44px;
}

dl a.row-item-link {
    z-index: 2;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    margin-left: 6px;
}

/* Forum/category/topic lists -------------------------------------------- */

.forabg,
.forumbg {
    border: 1px solid var(--tmf-border);
    border-top: 3px solid var(--tmf-accent);
    background: var(--tmf-surface);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}

.forabg .header,
.forumbg .header,
.forabg .header a,
.forumbg .header a,
.forumbg th,
.forumbg th a {
    color: #ffffff;
}

ul.forums {
    background: var(--tmf-surface-soft);
}

li.row {
    border-top-color: var(--tmf-border-soft);
    border-bottom-color: var(--tmf-border);
    background: var(--tmf-surface-soft);
}

li.row:hover {
    background: var(--tmf-surface-hover);
}

li.row:hover dd,
ul.topiclist dd {
    border-color: var(--tmf-border);
}

.rtl ul.topiclist dd {
    border-right-color: var(--tmf-border);
    border-left-color: transparent;
}

.rtl li.row:hover dd {
    border-right-color: var(--tmf-border);
    border-left-color: transparent;
}

ul.topiclist li,
ul.topiclist dd,
li.row strong {
    color: var(--tmf-text);
}

ul.forums dl.row-item::before {
    display: none;
}

ul.forums li.row dl.row-item dt .list-inner {
    padding-left: 0;
}

.tmf-forum-heading {
    display: flex;
    align-items: center;
    min-height: 44px;
    gap: 12px;
}

.tmf-forum-status-icon {
    display: block;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    background-image: url("./images/tmf-forum-status-icons-v2.png");
    background-repeat: no-repeat;
    background-size: 280px 160px;
}

.forum_read .tmf-forum-status-icon { background-position: 0 0; }
.forum_unread .tmf-forum-status-icon { background-position: -40px 0; }
.forum_read_locked .tmf-forum-status-icon { background-position: -80px 0; }
.forum_unread_locked .tmf-forum-status-icon { background-position: -120px 0; }
.forum_read_subforum .tmf-forum-status-icon { background-position: -160px 0; }
.forum_unread_subforum .tmf-forum-status-icon { background-position: -200px 0; }
.forum_link .tmf-forum-status-icon { background-position: -240px 0; }

.tmf-forum-heading .forum-image {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    float: none;
    margin: 0;
    padding: 0;
    line-height: 0;
}

.tmf-forum-heading .forum-image img {
    display: block;
    max-width: 36px;
    max-height: 36px;
    object-fit: contain;
}

.tmf-forum-heading a.forumtitle {
    display: flex;
    align-items: center;
    min-height: 40px;
    margin: 0;
    line-height: 1.2;
}

a.forumtitle,
a.topictitle {
    color: #ffffff;
}

a.forumtitle:hover,
a.topictitle:hover {
    color: var(--tmf-accent-hover);
}

.row .pagination li a {
    border-color: var(--tmf-border);
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

/* Panels, posts and profiles -------------------------------------------- */

.panel,
.post,
.bg1,
.bg2,
.bg3,
.ucprowbg,
.fieldsbg {
    border-color: var(--tmf-border-soft);
    background: var(--tmf-surface-soft);
    background-image: none;
    color: var(--tmf-text);
}

.post {
    border: 1px solid var(--tmf-border-soft);
}

.post:target {
    border-color: var(--tmf-accent);
    box-shadow: 0 0 0 1px rgba(240, 84, 84, 0.25);
}

.postbody,
.content,
.postprofile,
.postprofile strong,
.postprofile dt,
.postprofile dd,
dl.details dt,
dl.details dd,
table.table1 td,
table.table1 tbody th,
table.info tbody th,
label,
fieldset {
    color: var(--tmf-text);
}

.postbody h3,
.postbody h3 a,
.content h2,
.panel h2,
.content h3,
.panel h3 {
    color: var(--tmf-accent-hover);
}

.postprofile {
    border-color: var(--tmf-border);
}

.signature,
.notice {
    border-top-color: var(--tmf-border);
}

.online {
    background-color: transparent;
    background-image: none;
    background-repeat: no-repeat;
    background-position: 100% 0;
}

blockquote,
blockquote blockquote,
blockquote blockquote blockquote,
.codebox,
.attachbox,
.pm-message .attachbox {
    border-color: var(--tmf-border);
    background: #191919;
    color: var(--tmf-text);
}

blockquote cite,
.codebox p,
.attachbox p,
.attachbox p.stats,
dl.file dd,
dl.thumbnail dd {
    color: var(--tmf-text-muted);
}

.codebox code {
    color: #9bd4a9;
}

.attach-image img,
dl.thumbnail img {
    border-color: var(--tmf-border);
    background: #111111;
}

dl.faq dt {
    color: var(--tmf-text);
}

.posthilit {
    background: var(--tmf-danger-bg);
    color: #ffd7dc;
}

dl.thumbnail dt a:hover {
    background: var(--tmf-surface-hover);
}

dl.thumbnail dt a:hover img {
    border-color: var(--tmf-accent);
}

fieldset.polls dl {
    border-top-color: var(--tmf-border);
    color: var(--tmf-text-muted);
}

fieldset.polls dl.voted {
    color: var(--tmf-text);
}

fieldset.polls dd div {
    color: #ffffff;
}

.pm .postprofile {
    border-color: var(--tmf-border);
}

dd.profile-warnings {
    color: #ff969f;
}

/* Tables and control panels --------------------------------------------- */

table.table1 thead th {
    color: #ffffff;
}

table.table1 tbody tr {
    border-color: var(--tmf-border);
}

table.table1 tbody tr:hover,
table.table1 tbody tr.hover {
    background: var(--tmf-surface-hover);
    color: var(--tmf-text);
}

table.table1 tbody td {
    border-top-color: var(--tmf-border-soft);
}

table.zebra-list tr:nth-child(odd) td,
ul.zebra-list li:nth-child(odd) {
    background: #222222;
}

table.zebra-list tr:nth-child(even) td,
ul.zebra-list li:nth-child(even) {
    background: #292929;
}

/* User / Moderator control panels -------------------------------------- */

.panel-container h2,
.panel-container h3,
.cp-main h2,
.cp-main h3 {
    color: var(--tmf-accent-hover);
}

.panel-container h3,
.panel-container hr,
.cp-menu hr,
ul.cplist,
.panel-container .panel li.row,
.panel-container table.table1 thead th {
    border-color: var(--tmf-border);
}

.panel-container .panel,
.cp-main .pm,
.cp-main .pm-message,
.cp-mini {
    border-color: var(--tmf-border-soft);
    background: var(--tmf-surface-soft);
    background-image: none;
    color: var(--tmf-text);
}

.panel-container .panel li.header dd,
.panel-container .panel li.header dt,
.panel-container table.table1 thead th,
.panel-container table.table1 tbody th,
dl.mini dt,
.current {
    color: var(--tmf-text) !important;
}

.tabs .tab > a,
.minitabs .tab > a {
    border-color: var(--tmf-border);
    background: #343434;
    background-image: none;
    box-shadow: none;
    color: var(--tmf-text);
    filter: none;
}

.tabs .tab > a:hover,
.minitabs .tab > a:hover {
    background: var(--tmf-surface-hover);
    color: #ffffff;
}

.tabs .activetab > a,
.tabs .activetab > a:hover,
.minitabs .activetab > a,
.minitabs .activetab > a:hover {
    border-color: var(--tmf-accent);
    background: var(--tmf-surface);
    background-image: none;
    box-shadow: inset 0 -2px 0 var(--tmf-accent);
    color: #ffffff;
    filter: none;
}

.navigation a,
.rtl .navigation a,
#navigation a,
.rtl #navigation a {
    border: 1px solid var(--tmf-border-soft);
    background: #343434;
    background-image: none;
    color: var(--tmf-text);
    filter: none;
}

.navigation a:hover,
#navigation a:hover {
    background: var(--tmf-surface-hover);
    color: #ffffff;
}

.navigation .active-subsection a,
.navigation .active-subsection a:hover {
    border-color: var(--tmf-accent);
    background: var(--tmf-surface);
    box-shadow: inset 3px 0 0 var(--tmf-accent);
    color: #ffffff;
    filter: none;
}

.panel-container,
.cp-main,
.panel-container fieldset,
.panel-container dl,
.panel-container dt,
.panel-container dd,
.panel-container p,
.panel-container label,
.cp-main fieldset,
.cp-main dl,
.cp-main dt,
.cp-main dd,
.cp-main p,
.cp-main label {
    color: var(--tmf-text);
}

.panel-container .inputbox,
.cp-main .inputbox,
.panel-container select,
.cp-main select,
.panel-container textarea,
.cp-main textarea {
    border-color: #555555;
    background: #1e1e1e;
    color: #ffffff;
}

.panel-container .inputbox:disabled,
.cp-main .inputbox:disabled,
.panel-container select:disabled,
.cp-main select:disabled,
.panel-container textarea:disabled,
.cp-main textarea:disabled {
    background: #262626;
    color: #8a8a8a;
}

.pm-legend,
.pmlist li.pm_message_reported_colour,
.pm_message_reported_colour,
.pmlist li.pm_marked_colour,
.pm_marked_colour,
.pmlist li.pm_replied_colour,
.pm_replied_colour,
.pmlist li.pm_friend_colour,
.pm_friend_colour,
.pmlist li.pm_foe_colour,
.pm_foe_colour {
    background-color: transparent;
}

/* Forms and buttons ------------------------------------------------------ */

input.inputbox,
textarea.inputbox,
select,
.inputbox,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="url"],
input[type="number"] {
    border-color: #555555;
    background: #1e1e1e;
    color: #ffffff;
}

input.inputbox:hover,
textarea.inputbox:hover,
select:hover,
.inputbox:hover {
    border-color: #707070;
}

input.inputbox:focus,
textarea.inputbox:focus,
select:focus,
.inputbox:focus {
    border-color: var(--tmf-focus);
    color: #ffffff;
}

.inputbox::placeholder,
.inputbox:-moz-placeholder,
.inputbox::-webkit-input-placeholder {
    color: #9c9c9c;
    opacity: 1;
}

fieldset.quick-login input.inputbox,
.message-box textarea {
    background: #1e1e1e;
    color: #ffffff;
}

.message-box textarea.drag-n-drop {
    outline-color: rgba(240, 84, 84, 0.35);
}

.message-box textarea.drag-n-drop-highlight {
    outline-color: rgba(240, 84, 84, 0.8);
}

dd label,
fieldset dl:hover dt label,
fieldset.fields2 dl:hover dt label {
    color: var(--tmf-text);
}

input.disabled,
option.disabled-option,
label.disabled {
    color: #777777;
}

.button,
.button1,
.button2,
input.button1,
input.button2,
input.button3,
a.button1,
a.button2 {
    border-color: #812c2c;
    background: var(--tmf-accent-strong);
    background-image: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.24);
    color: #ffffff;
    text-shadow: none;
    transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.button:hover,
.button1:hover,
.button2:hover,
input.button1:hover,
input.button2:hover,
input.button3:hover,
a.button1:hover,
a.button2:hover {
    border-color: #a83a3a;
    background: var(--tmf-accent-strong);
    background-image: none !important;
    filter: none !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07), 0 1px 2px rgba(0, 0, 0, 0.24);
    color: #ffffff;
    text-shadow: none;
}

.button:focus,
.button1:focus,
.button2:focus,
input.button1:focus,
input.button2:focus,
input.button3:focus,
a.button1:focus,
a.button2:focus {
    border-color: #9f3838;
    background: var(--tmf-accent-strong);
    background-image: none !important;
    filter: none !important;
    color: #ffffff;
    text-shadow: none;
}

.button:focus-visible,
.button1:focus-visible,
.button2:focus-visible,
input.button1:focus-visible,
input.button2:focus-visible,
input.button3:focus-visible,
a.button1:focus-visible,
a.button2:focus-visible {
    border-color: var(--tmf-focus);
    box-shadow: 0 0 0 2px rgba(240, 84, 84, 0.16);
}

.button .icon,
.button1 .icon,
.button2 .icon,
.button-secondary,
.button:focus .icon,
.button:hover .icon {
    color: #ffffff;
}

.caret {
    border-color: var(--tmf-text-muted);
}

.contact-icons a {
    border-color: var(--tmf-border);
}

.contact-icons a:hover {
    background: var(--tmf-surface-hover);
}

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {
    border-color: #555555;
}

.tmf-navbar-search {
    float: right;
    margin: -3px 10px -3px 14px;
}

.tmf-navbar-search form {
    margin: 0;
}

.tmf-navbar-search-control {
    display: flex;
    align-items: center;
    overflow: hidden;
    height: 30px;
    border: 1px solid #414141;
    border-radius: 6px;
    background: #1b1b1b;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.45);
    transition: border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease;
}

.tmf-navbar-search-control:hover {
    border-color: #565656;
    background: #1d1d1d;
}

.tmf-navbar-search-control:focus-within {
    border-color: #8d3a3a;
    background: #1d1d1d;
    box-shadow: 0 0 0 2px rgba(240, 84, 84, 0.12);
}

.tmf-navbar-search-control .inputbox,
.tmf-navbar-search-control .inputbox:hover,
.tmf-navbar-search-control .inputbox:focus {
    width: 190px;
    height: 28px;
    margin: 0;
    padding: 4px 9px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--tmf-text);
    outline: 0;
}

.tmf-navbar-search-control .button-search,
.tmf-navbar-search-control .button-search-end {
    float: none;
    min-width: 31px;
    height: 30px;
    margin: 0;
    padding: 3px 7px;
    border: 0;
    border-left: 1px solid #672626;
    border-radius: 0;
    background: #923131;
    box-shadow: none;
    color: #ffffff;
    transition: background-color 0.16s ease;
}

.tmf-navbar-search-control .button-search-end {
    border-radius: 0 5px 5px 0;
}

.tmf-navbar-search-control .button-search:hover,
.tmf-navbar-search-control .button-search-end:hover {
    background: #923131;
    background-image: none !important;
    filter: none !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    text-shadow: none;
}

.tmf-navbar-search-control .button-search:focus,
.tmf-navbar-search-control .button-search-end:focus {
    background: #923131;
    background-image: none !important;
    filter: none !important;
    box-shadow: none;
    text-shadow: none;
}

.tmf-navbar-search-control .button-search:focus-visible,
.tmf-navbar-search-control .button-search-end:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--tmf-focus);
    outline-offset: -2px;
}

.search-results li:hover,
.search-results li.active {
    background: var(--tmf-surface-hover);
    color: var(--tmf-text);
}

.gallery label {
    border-color: var(--tmf-border);
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

.gallery label:hover {
    background: var(--tmf-surface-hover);
}

/* Pagination ------------------------------------------------------------- */

.pagination li a {
    border-color: var(--tmf-border);
    background: var(--tmf-surface);
    color: var(--tmf-text);
}

.pagination li.ellipsis span {
    color: var(--tmf-text-muted);
}

.pagination li a:hover,
.pagination li a:hover .icon,
.pagination li.active span,
.pagination .dropdown-visible a.dropdown-trigger,
.nojs .pagination .dropdown-container:hover a.dropdown-trigger {
    border-color: var(--tmf-accent);
    background: var(--tmf-accent-strong);
    color: #ffffff;
}

.responsive-tab .responsive-tab-link:before {
    border-color: var(--tmf-text-muted);
}

.responsive-tab .responsive-tab-link:hover:before {
    border-color: var(--tmf-accent-hover);
}

.file-progress {
    background-color: var(--tmf-border);
}

.file-progress-bar,
.file-total-progress-bar {
    background-color: #4f9f62;
}

/* Dropdowns, notifications and overlays -------------------------------- */

.dropdown .dropdown-contents,
.dropdown-extended .dropdown-contents,
.dropdown-extended .header,
.dropdown-extended .footer {
    border-color: var(--tmf-border);
    background: var(--tmf-surface);
    background-image: none;
    color: var(--tmf-text);
    text-shadow: none;
}

.dropdown .pointer {
    border-color: var(--tmf-border) transparent;
}

.dropdown .pointer-inner,
.dropdown-extended .pointer-inner {
    border-color: var(--tmf-surface) transparent;
}

.dropdown li,
.dropdown li li,
.dropdown-extended ul li {
    border-color: var(--tmf-border-soft);
}

.dropdown-extended ul li:hover {
    background: var(--tmf-surface-hover);
}

.dropdown-extended .header,
.dropdown-extended .header a,
.dropdown-extended .footer a,
.notification_list p.notification-time {
    color: var(--tmf-text-muted);
}

.notification_list p.notifications_title,
.notification_list p.notification-reference,
.notification_list p.notification-location {
    color: var(--tmf-text);
}

.phpbb_alert {
    border-color: var(--tmf-border);
    background: var(--tmf-surface-raised);
    color: var(--tmf-text);
}

.darken {
    background: #000000;
}

/* Notices --------------------------------------------------------------- */

div.rules,
p.post-notice {
    border: 1px solid #754047;
    background: var(--tmf-danger-bg);
    background-image: none;
    color: #ffd7dc;
}

.error {
    color: #ff969f;
}

.reported {
    background: var(--tmf-danger-bg);
}

.warning {
    background: var(--tmf-warning-bg);
}

.badge {
    background: var(--tmf-accent-strong);
    color: #ffffff;
}

/* Footer ---------------------------------------------------------------- */

.copyright,
.footer-row,
.footer-copyright,
.footer-info {
    color: var(--tmf-text-muted);
}

.footer-link {
    color: var(--tmf-accent);
}

.tmf-site-footer {
    margin-top: 28px;
    padding: 18px 20px;
    border-top: 1px solid #3a3a3a;
    background: linear-gradient(to bottom, #2d2d2d 0%, #202020 100%);
    color: #aaaaaa;
    text-align: center;
}

.tmf-site-footer p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.6;
}

.tmf-site-footer strong {
    color: #dddddd;
}

.tmf-site-footer a {
    color: var(--tmf-accent-hover);
    text-decoration: none;
}

.tmf-site-footer a:hover,
.tmf-site-footer a:focus-visible {
    text-decoration: underline;
}

/* Responsive ------------------------------------------------------------ */

@media (max-width: 1220px) {
    .wrap {
        margin: 20px 12px;
    }
}

@media (max-width: 768px) {
    .tmf-global-nav {
        padding: 15px 0;
    }

    .tmf-global-nav a {
        margin: 0 10px;
        padding: 0;
        font-size: 1rem;
    }

    .wrap {
        margin: 0;
        padding: 8px 5px;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .headerbar,
    .navbar,
    .forabg,
    .forumbg,
    .post,
    .panel {
        border-radius: 4px;
    }

    .tmf-site-footer {
        margin-top: 18px;
    }
}

@media (min-width: 701px) {
    #nav-breadcrumbs {
        position: relative;
        min-height: 32px;
        padding-right: 270px;
    }

    #nav-breadcrumbs .tmf-navbar-search {
        position: absolute;
        top: 50%;
        right: 0;
        float: none;
        margin: 0;
        transform: translateY(-50%);
    }

    ul.forums .tmf-forum-heading {
        justify-content: flex-start;
        width: auto;
        min-height: 60px;
    }
}

@media (max-width: 700px) {
    .tmf-navbar-search {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tmf-skip-link,
    .tmf-global-nav a,
    .button,
    .button1,
    .button2 {
        transition: none;
    }
}
