/* Reusable pieces: news list, tags, tables, buttons, badges, pager,
   comments, forms and the retro LED visitor counter. */

/* News / post-meta list */
.news .item{ padding:6px 0; border-bottom:1px dotted var(--dotb); }
.news .item:last-child{ border-bottom:0; padding-bottom:0; }
.news .date{ color:var(--band-2); font-weight:bold; margin-right:6px; }
.tag{ display:inline-block; font-size:11px; font-weight:bold; text-transform:uppercase; letter-spacing:.4px; padding:1px 5px; margin-left:2px; color:var(--tag-tx); background:var(--tag-bg); border:1px solid var(--tag-bd); }
.entry-meta{ font-size:13px; color:var(--muted); margin:0 0 8px; }
.entry-meta a{ color:var(--muted); }

/* Download / data table */
.tablewrap{ overflow-x:auto; }
table.dl, .content table{ width:100%; border-collapse:collapse; font-size:14px; }
table.dl th, .content table th{ text-align:left; padding:5px 8px; color:var(--ink); white-space:nowrap; background:linear-gradient(180deg,var(--th-1),var(--th-2)); border:1px solid var(--lo); }
table.dl td, .content table td{ padding:5px 8px; border:1px solid var(--lt); vertical-align:middle; }
table.dl tr:nth-child(even) td{ background:var(--zebra); }
.ver{ font-family:var(--vr-font-mono); }
.size{ font-variant-numeric:tabular-nums; color:var(--muted); white-space:nowrap; }

/* Beveled buttons and badges */
.btn, .btn:visited, .content .wp-block-button__link, .content .wp-block-button__link:visited{ display:inline-block; padding:3px 13px; font:inherit; color:var(--ink); cursor:pointer; text-decoration:none; white-space:nowrap; background:linear-gradient(180deg,rgba(255,255,255,.3),var(--face) 55%,var(--face-lt)); border:1px solid; border-color:var(--hi) var(--sh) var(--sh) var(--hi); box-shadow:inset -1px -1px 0 var(--lo), inset 1px 1px 0 rgba(255,255,255,.35); }
.btn:hover{ background:linear-gradient(180deg,rgba(255,255,255,.45),var(--hover) 55%,var(--face)); }
.btn.primary{ font-weight:bold; }
.btn:active{ box-shadow:inset 1px 1px 0 var(--lo); }
.badge{ display:inline-flex; align-items:center; gap:5px; padding:2px 7px; color:var(--ink); background:var(--panel); border:1px solid; border-color:var(--sh) var(--hi) var(--hi) var(--sh); box-shadow:inset 1px 1px 0 var(--lo); }

/* Single-post navigation: plain Previous/Next buttons, no box */
.post-nav{ display:flex; justify-content:space-between; align-items:center; gap:10px; }

/* Pagination */
.vr-pager{ display:flex; gap:6px; flex-wrap:wrap; justify-content:center; margin-top:14px; }
.vr-pager .nav-links{ display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.vr-pager .page-numbers{ padding:3px 10px; text-decoration:none; background:linear-gradient(180deg,var(--face),var(--face-lt)); border:1px solid var(--lo); color:var(--link); }
.vr-pager .page-numbers.current{ background:linear-gradient(180deg,var(--hdr-1),var(--hdr-2)); color:var(--hd-ink); font-weight:bold; }

/* Comments */
.commentlist{ list-style:none; margin:0; padding:0; }
.commentlist li{ padding:8px 0; border-bottom:1px dotted var(--dotb); }
.commentlist .children{ list-style:none; margin:0 0 0 18px; padding:0; }
.comment-meta{ font-size:13px; color:var(--muted); margin-bottom:3px; }

/* Forms (comments + search) */
.comment-form input[type=text], .comment-form input[type=email], .comment-form input[type=url], .comment-form textarea, .vr-search input[type=search]{
  font:inherit; padding:6px 8px; background:var(--page); color:var(--ink); border:1px solid var(--lo); box-shadow:inset 0 1px 3px rgba(0,0,0,.22); }
.comment-form textarea{ width:100%; }
#reply-title{ font-size:14px; font-weight:normal; color:var(--ink); margin:0 0 10px; }
.comment-form .vr-submit{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:10px; }
.vr-formnote{ color:var(--muted); font-size:13px; }
.vr-formnote a{ color:var(--muted); }
.vr-search{ display:flex; gap:6px; }

/* Widget titles. Classic widgets already use the theme's before_title wrapper
   (a real .hd blue bar). For block widgets the heading arrives inside the body,
   so render the first heading in a widget as the same retro bar by bleeding it
   out over the .bd padding. */
.panel.widget > .bd > h2:first-child,
.panel.widget > .bd > h3:first-child,
.panel.widget > .bd > .wp-block-heading:first-child,
.panel.widget > .bd > .widget-title:first-child{
  margin:-9px -11px 9px; padding:4px 9px; font-size:14px; font-weight:bold; letter-spacing:.2px;
  color:var(--hd-ink); text-shadow:0 1px 1px rgba(0,0,0,.5),0 0 3px rgba(0,0,0,.35);
  background:linear-gradient(180deg,var(--hdr-1),var(--hdr-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28); border-bottom:1px solid rgba(0,0,0,.22);
}
/* Fallback for any other widget heading: at least colour it as an accent. */
.widget-title{ margin:0 0 6px; color:var(--band-2); font-weight:bold; font-size:15px; }

/* Micro Posts entries (right column on the blog) */
.microlist{ display:flex; flex-direction:column; }
.micro{ padding:11px 0; border-bottom:1px solid var(--ink); }
.micro:first-child{ padding-top:0; }
.micro:last-child{ border-bottom:0; padding-bottom:0; }
.micro-date{ display:block; margin:0 0 4px; font-size:13px; color:var(--muted); text-decoration:none; }
.micro-date:hover{ text-decoration:underline; }
.micro-body{ margin:0; word-wrap:break-word; overflow-wrap:break-word; }
.micro-body a{ word-break:break-all; }
.micro-more{ margin:12px 0 0; padding-top:11px; border-top:1px solid var(--lo); font-size:13px; }

/* Retro LED visitor counter */
.counter{ font-family:var(--vr-font-mono); letter-spacing:2px; background:#0d0a06; color:var(--counter); padding:2px 6px; border:1px solid #000; }