/* Forum layer: classic message-board structure on top of the base theme (breadcrumbs, compact status, sub-tabs, pager, row menus).
   Loaded last on every page; colours come only from the theme variables in style.css (blue by default, [data-theme="rose"] = original). */

/* ---- breadcrumb bar ---- */
.crumbs { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 27px; padding: 3px 10px; background: var(--panel-deep); border-bottom: 1px solid var(--line-soft); font-size: 11px; }
.crumbs nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0 5px; min-width: 0; }
.crumbs a, .crumbs .crumb-link { color: var(--link); text-decoration: none; background: none; border: 0; padding: 0; margin: 0; min-height: 0; font: inherit; cursor: pointer; }
.crumbs a:hover, .crumbs .crumb-link:hover { color: var(--link-hover); text-decoration: underline; }
.crumbs .current { color: var(--text); font-weight: 700; overflow-wrap: anywhere; }
.crumbs .sep { color: var(--muted); }
.crumbs #internetStatus { margin: 0; flex: 0 1 auto; max-width: 45%; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }

/* ---- not signed in: no tabs, nothing to navigate to yet ---- */
.signed-out .site-header .topbar-menu, .signed-out .site-header .menu-toggle, .signed-out .crumbs { display: none; }

/* ---- Downloads sub-tabs (a classic forum tab strip) ---- */
.subtabs { display: flex; flex-wrap: wrap; gap: 2px; margin: 0 0 8px; border-bottom: 2px solid var(--selected); }
.subtabs button { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; margin: 0; padding: 5px 14px; border: 1px solid var(--line-soft); border-bottom: 0; border-radius: 0; background: var(--panel-alt); color: var(--text); font: inherit; cursor: pointer; }
.subtabs button:hover { background: var(--btn-hover); color: #fff; }
.subtabs button.active { background: var(--selected); border-color: var(--selected); color: #fff; font-weight: 700; }
.subtabs .count { min-width: 18px; padding: 0 5px; border: 1px solid var(--btn-border); background: var(--panel-deep); color: var(--text); font-size: 10px; text-align: center; }
.dl-pane > .resultbar:first-child { margin-top: 0; }
@media (max-width: 620px) {
  .subtabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; margin: 0 0 8px; border-bottom: 0; }
  .subtabs button { justify-content: center; min-height: 44px; padding: 6px 4px; border-bottom: 1px solid var(--line-soft); text-align: center; }
}

/* ---- history rows: one summary line, the rest behind "Details" ---- */
.history-extra { margin-top: 4px; }
.history-extra > summary { display: inline-block; color: var(--link); font-size: 10px; cursor: pointer; }
.history-extra .history-tags { margin-top: 4px; }
.history-extra .history-paths b { display: block; color: var(--text); font-size: 10px; }
.narrow-input { width: 8em; }

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- service status lives in the breadcrumb bar ---- */
.crumb-status { display: flex; align-items: center; flex: 1 1 auto; justify-content: flex-end; flex-wrap: wrap; gap: 0 12px; min-width: 0; color: var(--text); }
.crumb-status .st { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.crumb-status b { color: var(--muted); font-weight: 700; }
.crumbs { flex-wrap: wrap; }
@media (max-width: 620px) {
  .crumbs { padding: 4px 8px; row-gap: 2px; }
  .crumb-status { flex-basis: 100%; justify-content: flex-start; gap: 0 10px; font-size: 10px; }
  .crumb-status b { display: none; }
  .crumb-status #freeSpace::after { content: " free"; color: var(--muted); }
  .crumb-status #qbState::before { content: "qB "; color: var(--muted); }
  .crumbs #internetStatus { display: none; }
}

/* ---- search form on phones: query and Search first, then the pickers ---- */
@media (max-width: 620px) {
  .searchline { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .searchline > * { grid-row: auto; }
  .query-label { order: 1; grid-column: 1 / 4; }
  #searchButton { order: 2; grid-column: 4; }
  .source-control { order: 3; grid-column: 1 / 3; }
  .category-control { order: 4; grid-column: 3 / 5; }
  #languageFilter { order: 5; grid-column: 1 / 3; }
  #tagBrowserFilter { order: 6; grid-column: 3 / 5; }
  .advanced-search { order: 7; grid-column: 1 / -1; }
  .searchline select, .searchline input, .searchline button { min-height: 40px; }
  .advanced-search > summary { display: flex; align-items: center; min-height: 40px; }
}

/* ---- "Download from this page" is one line until opened ---- */
.page-download-tools { display: block; padding: 0; }
.page-download-tools > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 6px 8px; color: var(--link); cursor: pointer; font-weight: 700; list-style-position: inside; }
.page-download-tools > summary .muted { color: var(--muted); font-weight: 400; font-size: 10px; }
.page-download-tools[open] > summary { border-bottom: 1px solid var(--line-soft); }
.page-tools-body { display: flex; flex-wrap: wrap; align-items: end; gap: 7px 12px; padding: 7px 8px; }
#pageDownloadStatus { flex-basis: 100%; }

/* ---- numbered pager ---- */
.pagination { flex-wrap: wrap; gap: 4px 6px; }
.pager-pages { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 3px; }
.pager-num { min-width: 32px; min-height: 28px; padding: 3px 7px; text-align: center; }
.pager-num.current { background: var(--selected); border-color: var(--selected); color: #fff; font-weight: 700; }
.pager-gap { color: var(--muted); padding: 0 2px; }
.pagination span:not(.pager-pages):not(.pager-gap) { min-width: 0; color: var(--muted); font-size: 11px; white-space: nowrap; }
.pager-go { width: 74px; min-height: 26px; padding: 2px 5px; margin-left: 4px; }
@media (max-width: 620px) {
  .pagination { gap: 4px; padding: 4px 6px; }
  .pager-num { min-width: 40px; min-height: 40px; }
  .pager-num.far, .pager-gap { display: none; }
  .pagination > .smallbutton:not(.pager-num) { min-height: 40px; }
  .pagination > span:not(.pager-pages) { flex-basis: 100%; text-align: center; order: 5; }
  .pager-go { display: none; }
}

/* ---- Nyaa / Sukebei rows on phones: title and Download on the first line, seeders, downloads and size on the second ---- */
@media (max-width: 620px) {
  .release.native-release:not(.releasehead) { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; min-height: 0; padding: 8px 6px; }
  .native-release > .entry-number { flex: 0 0 28px; text-align: right; }
  .native-release > div { flex: 1 1 calc(100% - 134px); min-width: 0; }
  .native-release > button { flex: 0 0 92px; min-height: 42px; }
  .native-release > .metric { flex: 0 0 auto; font-size: 11px; color: var(--muted); text-align: left; }
  .native-release > .seeds { order: 4; margin-left: 34px; color: var(--green); }
  .native-release > .seeds::before { content: "\25B2  "; }
  .native-release > .downloads { order: 5; display: block; }
  .native-release > .downloads::before { content: "\2193  "; }
  .native-release > .size { order: 6; display: block; }
  .native-release > .leechers { display: none; }
  .releasehead.native-release { display: flex; flex-wrap: wrap; gap: 3px; padding: 4px 6px; min-height: 0; }
  .releasehead.native-release > .entry-number, .releasehead.native-release > .leechers, .releasehead.native-release > span:last-child { display: none; }
  .releasehead.native-release .sort-heading { width: auto; min-height: 38px; padding: 6px 10px; border: 1px solid var(--line-soft); text-align: left; }
}

/* ---- queue: active jobs first, finished ones folded away ---- */
.finished-jobs { border-top: 1px solid var(--line); background: var(--panel-deep); }
.finished-jobs > summary { display: flex; align-items: center; min-height: 36px; padding: 8px 10px; color: var(--link); font-weight: 700; cursor: pointer; }
.finished-jobs[open] > summary { border-bottom: 1px solid var(--line-soft); }
@media (max-width: 620px) {
  .releasehead.native-release .sort-heading { padding: 6px 7px; font-size: 11px; }
}

/* ---- history: pages and a filter box that folds on phones ---- */
.history-pager { margin-top: 0; }
.history-pager:first-of-type { border-top: 0; }
.filter-box { margin: 0; }
.filter-box > summary { display: none; }
@media (max-width: 620px) {
  .filter-box > summary { display: flex; align-items: center; min-height: 40px; padding: 6px 10px; border: 1px solid var(--line); background: var(--panel-alt); color: var(--link); font-weight: 700; cursor: pointer; }
  .filter-box[open] > summary { border-bottom: 0; }
}

/* ---- Health: closed sections read as one dense status row each ---- */
.health-section { margin: 3px 0; padding: 0; }
.health-section > summary { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 6px 12px; cursor: pointer; list-style-position: inside; }
.health-section > summary h3 { margin: 0; font-size: 12px; flex: 0 1 auto; }
.health-icon { flex: 0 0 18px; color: var(--green); font-weight: 700; text-align: center; }
.health-icon.warn { color: var(--yellow); }
.health-sum { flex: 1 1 auto; min-width: 0; overflow: hidden; color: var(--muted); font-size: 11px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.health-section > :not(summary) { margin-left: 12px; margin-right: 12px; }
.health-section > :last-child { margin-bottom: 12px; }
@media (max-width: 620px) {
  .health-section > summary { flex-wrap: wrap; gap: 2px 8px; min-height: 44px; }
  .health-sum { flex-basis: 100%; padding-left: 26px; text-align: left; white-space: normal; font-size: 11px; }
}
.panel.health-section { padding: 0; margin: 3px 0; }

/* ---- gallery page: grouped tags like a forum post header; title and Download come first on phones ---- */
.gallery-tags { display: block; }
.gallery-tags .info-row { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 6px; align-items: start; padding: 5px 0; border-bottom: 1px solid var(--line-soft); }
.gallery-tags .info-row > b { color: var(--muted); font-size: 11px; }
.gallery-tags .info-links { display: flex; flex-wrap: wrap; gap: 3px; }
.gallery-tags .tags-row.collapsed .info-links { max-height: 58px; overflow: hidden; }
.gallery-tags .tags-toggle { grid-column: 2; justify-self: start; min-height: 30px; margin-top: 2px; }
.gallery-heading .gallery-actions { margin-top: 10px; }
@media (max-width: 650px) {
  .gallery-summary { display: flex; flex-direction: column; }
  .gallery-heading { order: 1; }
  .gallery-cover { order: 2; height: min(48dvh, 420px); min-height: 240px; }
  .gallery-tags .info-row { grid-template-columns: 1fr; gap: 3px; }
  .gallery-actions .smallbutton, .gallery-actions button { min-height: 44px; flex: 1 1 auto; }
}

footer { flex-wrap: wrap; gap: 4px 14px; font-size: 11px; }
footer #footStats { flex: 1 1 auto; text-align: center; }
@media (max-width: 620px) { footer .hint { display: none; } footer #footStats { flex-basis: 100%; order: 3; text-align: left; } }

/* ---- accessibility: visible keyboard focus, legible disabled controls ---- */
:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.site-header :focus-visible, .subtabs :focus-visible, .crumbs :focus-visible { outline-offset: -2px; }
.primary:disabled, .smallbutton:disabled { color: var(--muted); opacity: .65; }

/* ---- Duplicate manager: header, filters, one card per duplicate group ---- */
.dup-head { padding: 0; margin-bottom: 8px; }
.dup-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-bottom: 1px solid var(--line-soft); }
.dup-stats > div { padding: 6px 10px; border-right: 1px solid var(--line-soft); min-width: 0; }
.dup-stats > div:last-child { border-right: 0; }
.dup-stats span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.dup-stats b { display: block; margin-top: 2px; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dup-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 7px 8px; }
.dup-filters { display: flex; flex-wrap: wrap; gap: 3px; margin-right: auto; }
.dup-filter { min-height: 30px; padding: 4px 10px; border: 1px solid var(--line-soft); background: var(--panel-alt); color: var(--text); font: inherit; cursor: pointer; }
.dup-filter:hover { background: var(--btn-hover); color: #fff; }
.dup-filter.active { background: var(--selected); border-color: var(--selected); color: #fff; font-weight: 700; }
.dup-search input { width: 190px; min-height: 30px; }
.dup-sort select { min-height: 30px; width: auto; }
.dup-list { display: flex; flex-direction: column; gap: 8px; }
.dup-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; padding: 8px; border: 1px solid var(--line); background: var(--panel); border-left: 3px solid var(--yellow); }
.dup-card.safe { border-left-color: var(--green); }
.dup-cover { display: flex; align-items: center; justify-content: center; width: 96px; height: 136px; border: 1px solid var(--border-dim); background: var(--thumb-bg); color: var(--muted); font-size: 28px; overflow: hidden; }
.dup-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dup-main { min-width: 0; }
.dup-title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.dup-title h3 { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.dup-meta { margin: 3px 0 6px; color: var(--muted); font-size: 11px; }
.dup-copies { border: 1px solid var(--line-soft); }
.dup-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) 76px 92px 74px; align-items: center; gap: 6px; padding: 5px 6px; border-bottom: 1px solid var(--line-soft); }
.dup-row:last-child { border-bottom: 0; }
.dup-row:nth-child(even):not(.dup-row-head) { background: var(--row-alt); }
.dup-row.suggested { background: rgba(127, 208, 139, .10) !important; }
.dup-row.alias { opacity: .6; }
.dup-row-head { min-height: 24px; background: var(--table-head); color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.dup-row-head span:nth-child(3), .dup-row-head span:nth-child(4), .dup-size, .dup-fav { text-align: right; }
.dup-pick { display: flex; justify-content: center; margin: 0; }
.dup-pick input { width: 18px; height: 18px; margin: 0; }
.dup-name { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; min-width: 0; }
.dup-file { flex: 1 1 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.dup-id { color: var(--muted); font-size: 10px; }
.dup-size { color: var(--muted); font-variant-numeric: tabular-nums; }
.dup-fav { color: var(--text); font-variant-numeric: tabular-nums; }
.dup-suggest { color: var(--green); border-color: #568056; }
.dup-kind-bulk { color: var(--bookmark); border-color: var(--bookmark-line); }
.dup-kind-loose { color: var(--yellow); border-color: #7a6d3c; }
.dup-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 6px; }
.dup-note { margin-right: auto; color: var(--muted); font-size: 11px; }
.dup-trash { margin-top: 8px; padding: 0; }
.dup-trash > summary { padding: 8px 10px; color: var(--link); font-weight: 700; cursor: pointer; }
.dup-trash-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border-top: 1px solid var(--line-soft); }
.dup-trash-name { display: flex; flex-direction: column; min-width: 0; font-size: 11px; }
.dup-trash-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dup-card .duplicate-preview { grid-column: 1 / -1; }
@media (max-width: 760px) {
  .dup-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dup-stats > div:nth-child(3) { border-right: 0; }
  .dup-stats > div:nth-child(-n+3) { border-bottom: 1px solid var(--line-soft); }
}
@media (max-width: 620px) {
  .dup-toolbar { gap: 6px; }
  .dup-filters { width: 100%; }
  .dup-filter { min-height: 38px; }
  .dup-search { flex: 1 1 100%; }
  .dup-search input { width: 100%; min-height: 40px; }
  .dup-sort { flex: 1 1 auto; }
  .dup-sort select { width: 100%; min-height: 40px; }
  .dup-toolbar .smallbutton { min-height: 40px; }
  .dup-card { grid-template-columns: 1fr; padding: 8px 6px; }
  .dup-cover { width: 100%; height: 120px; }
  .dup-row-head { display: none; }
  .dup-row { grid-template-columns: 34px minmax(0, 1fr) auto; grid-template-areas: "pick name name" "pick size fav" "pick inspect inspect"; row-gap: 4px; padding: 8px 4px; }
  .dup-pick { grid-area: pick; align-self: start; padding-top: 3px; }
  .dup-name { grid-area: name; }
  .dup-size { grid-area: size; text-align: left; }
  .dup-fav { grid-area: fav; }
  .dup-inspect { grid-area: inspect; justify-self: start; min-height: 38px; }
  .dup-actions .smallbutton { flex: 1 1 100%; min-height: 42px; }
  .dup-note { flex-basis: 100%; }
}