/*
Theme Name: Trolls Cave
Theme URI: https://trollcave.club/
Author: Trolls Cave
Description: Native WordPress theme for the Trolls Cave tabletop wargaming club.
Version: 2.0.33
Requires at least: 6.0
Tested up to: 7.0
Text Domain: trolls-cave
*/

html, body { margin: 0; padding: 0; background: #070806; }

/* High-contrast labels on the bright club-green action buttons. */
a.bg-primary-500,
button.bg-primary-500 {
  color: #101507 !important;
  text-shadow: none;
}

.wp-blog-content { color: #d2d2cc; font-size: 18px; line-height: 1.8; }
.wp-blog-content p, .wp-blog-content ul, .wp-blog-content ol,
.wp-blog-content blockquote, .wp-blog-content figure { margin: 0 0 1.25em; }
.wp-blog-content h2, .wp-blog-content h3, .wp-blog-content h4 {
  color: #f2f2ed; font-weight: 700; line-height: 1.2; margin: 1.8em 0 .7em;
}
.wp-blog-content h2 { font-size: 1.75rem; }
.wp-blog-content h3 { font-size: 1.35rem; }
.wp-blog-content ul, .wp-blog-content ol { padding-left: 1.4em; }
.wp-blog-content a { color: #a3e600; text-decoration: underline; text-underline-offset: 3px; }
.wp-blog-content img { max-width: 100%; height: auto; border-radius: .5rem; }

.trolls-gtranslate-bootstrap { position: fixed; left: -10000px; top: auto; }
/* Translation is controlled by the theme's EN/UA/RU buttons. */
body { top: 0 !important; }
body > .skiptranslate,
iframe.goog-te-banner-frame,
iframe.skiptranslate,
.VIpgJd-ZVi9od-ORHb-OEVmcd {
  display: none !important;
  height: 0 !important;
  visibility: hidden !important;
}
#google_translate_element,
.trolls-gtranslate-bootstrap {
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
}
.trolls-language-switcher { display: inline-flex; align-items: center; gap: 3px; margin-right: 8px; }
.trolls-language-switcher a {
  align-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 4px;
  color: rgba(255,255,255,.78)!important; display: inline-flex; font-size: 11px;
  font-weight: 700; height: 26px; justify-content: center; min-width: 30px;
  padding: 0 5px; text-decoration: none!important;
}
.trolls-language-switcher a:hover, .trolls-language-switcher a:focus-visible,
.trolls-language-switcher a.gt-current-lang {
  background: rgba(163,230,0,.12); border-color: #a3e600; color: #a3e600!important;
}

html.trolls-awaiting-translation body::before {
  align-items: center; background: #07100e; color: #a3e600; content: "TROLLS CAVE";
  display: flex; font-family: Arial,sans-serif; font-size: clamp(22px,3vw,42px);
  font-weight: 800; inset: 0; justify-content: center; letter-spacing: .08em;
  position: fixed; z-index: 2147483646;
}
html.trolls-awaiting-translation body::after {
  animation: trolls-loading-spin 750ms linear infinite; border: 2px solid rgba(163,230,0,.25);
  border-radius: 50%; border-top-color: #a3e600; content: ""; height: 28px;
  left: calc(50% - 14px); position: fixed; top: calc(50% + 44px); width: 28px;
  z-index: 2147483647;
}
@keyframes trolls-loading-spin { to { transform: rotate(360deg); } }

.trolls-mobile-menu {
  background: rgba(7,8,6,.98); border-top: 1px solid #262722; display: none;
  left: 0; padding: 1rem; position: absolute; right: 0; top: 100%;
}
.trolls-mobile-menu.is-open { display: flex; flex-direction: column; gap: .35rem; }
.trolls-mobile-menu a { color: #ddd; padding: .7rem 1rem; text-decoration: none; }
.trolls-systems-trigger[aria-expanded="true"] .ri-arrow-down-s-line { transform: rotate(180deg); }
.trolls-systems-menu {
  background: rgba(13,15,12,.98); border: 1px solid #2b2e27; border-radius: .6rem;
  box-shadow: 0 18px 45px rgba(0,0,0,.55); display: none; gap: .15rem;
  min-width: 285px; padding: .55rem; position: absolute; top: calc(100% + .4rem); z-index: 100;
}
.trolls-systems-menu.is-open { display: grid; grid-template-columns: 1fr; }
@media (hover: hover) and (pointer: fine) {
  header .relative:hover > .trolls-systems-menu,
  header .relative:focus-within > .trolls-systems-menu,
  footer .relative:hover > .trolls-systems-menu,
  footer .relative:focus-within > .trolls-systems-menu {
    display: grid; grid-template-columns: 1fr;
  }
  header .trolls-systems-menu { top: 100%; }
  footer .trolls-systems-menu { bottom: 100%; }
}
.trolls-systems-menu a {
  border-radius: .35rem; color: #c8c9c3; display: block; font-size: .82rem;
  padding: .55rem .7rem; text-decoration: none; white-space: nowrap;
}
.trolls-systems-menu a:hover, .trolls-systems-menu a:focus-visible {
  background: rgba(163,230,0,.1); color: #a3e600; outline: none;
}
footer .trolls-systems-menu { bottom: calc(100% + .35rem); left: 0; top: auto; }
.trolls-mobile-menu .trolls-language-switcher { display: flex; margin: 0 0 .5rem; padding: 0 .7rem; }
.trolls-mobile-menu .trolls-mobile-systems { border-top: 1px solid #262722; margin-top: .35rem; padding-top: .35rem; }
.trolls-mobile-menu .trolls-mobile-systems a { font-size: .82rem; padding-left: 1.5rem; }
.trolls-mobile-menu .trolls-mobile-systems strong { color: #a3e600; display: block; font-size: .78rem; padding: .7rem 1rem .35rem; text-transform: uppercase; }
@media (max-width: 1023px) {
  header.fixed { background: rgba(7,8,6,.92); backdrop-filter: blur(12px); }
  .trolls-mobile-menu { max-height: calc(100vh - 4rem); overflow-y: auto; }
}
.trolls-lightbox {
  align-items: center; background: rgba(0,0,0,.92); display: flex; inset: 0;
  justify-content: center; padding: 2rem; position: fixed; z-index: 99999;
}
.trolls-lightbox img { max-height: 88vh; max-width: 92vw; object-fit: contain; }
.trolls-lightbox button { position: absolute; right: 1rem; top: 1rem; }
.trolls-article-hidden { display: none!important; }
.trolls-articles-grid { align-items: stretch; }
.trolls-article-card { height: 100%; }
.trolls-article-card > a:first-child {
  display: block; flex: 0 0 220px; height: 220px; overflow: hidden;
}
.trolls-article-card > a:first-child img {
  display: block; height: 100%; object-fit: cover; object-position: top; width: 100%;
}
.trolls-article-card > div {
  flex: 1 1 auto; justify-content: flex-start; min-height: 205px;
}
.trolls-article-card > div > p:last-child { margin-top: auto; }
@media (max-width: 639px) {
  .trolls-article-card > a:first-child { flex-basis: 210px; height: 210px; }
  .trolls-article-card > div { min-height: 0; }
}

.trolls-news-track {
  display: flex; flex-direction: column; gap: 1rem; margin-top: 2rem; max-height: 600px;
  overflow-y: auto; padding: 1px .6rem 1px 1px; scrollbar-color: #5f7f14 #151712; scrollbar-width: thin;
}
.trolls-news-card { border-radius: .55rem; display: flex; flex: 0 0 auto; gap: 1.25rem; padding: 1.25rem; }
.trolls-news-cover { border: 1px solid #2d2f29; border-radius: .4rem; display: block; flex: 0 0 256px; height: 176px; overflow: hidden; }
.trolls-news-cover img { display: block; height: 100%; object-fit: cover; transition: transform .45s; width: 100%; }
.trolls-news-card:hover .trolls-news-cover img { transform: scale(1.04); }
.trolls-news-body { display: flex; flex: 1; flex-direction: column; gap: .6rem; min-width: 0; padding: .15rem 0; }
.trolls-news-meta { align-items: center; color: #777a71; display: flex; flex-wrap: wrap; font-size: .75rem; gap: .75rem; }
.trolls-news-meta time { align-items: center; display: inline-flex; gap: .4rem; white-space: nowrap; }
.trolls-news-meta span { background: #efd5dc; border-radius: 999px; color: #29171b; font-weight: 700; padding: .2rem .7rem; white-space: nowrap; }
.trolls-news-body h3 { color: #f2f2ed; font-family: inherit; font-size: 1.1rem; font-weight: 800; line-height: 1.3; margin: 0; }
.trolls-news-body h3 a { color: inherit; text-decoration: none; }
.trolls-news-body p { color: #999b92; font-size: .9rem; line-height: 1.55; margin: 0; }
.trolls-comments { border-top: 1px solid #2b2e27; margin-top: 3rem; padding-top: 2.5rem; }
.trolls-comments-title, .trolls-comments .comment-reply-title { color: #f2f2ed; font-family: inherit; font-size: 1.6rem; font-weight: 800; margin: 0 0 1.5rem; }
.trolls-comment-list { display: flex; flex-direction: column; gap: 1rem; list-style: none; margin: 0 0 2.5rem; padding: 0; }
.trolls-comment-list .children { display: flex; flex-direction: column; gap: 1rem; list-style: none; margin: 1rem 0 0 2rem; padding: 0; }
.trolls-comment-list .comment-body { background: #151712; border: 1px solid #2b2e27; border-radius: .55rem; padding: 1.25rem; }
.trolls-comment-list .comment-meta { color: #85887e; font-size: .78rem; margin-bottom: .85rem; }
.trolls-comment-list .comment-author { align-items: center; color: #f2f2ed; display: flex; font-weight: 700; gap: .65rem; }
.trolls-comment-list .avatar { border-radius: 50%; height: 34px; width: 34px; }
.trolls-comment-list .comment-content { color: #b5b7ae; line-height: 1.7; }
.trolls-comment-list .comment-content p { margin: .5rem 0; }
.trolls-comment-list .reply a, .trolls-comments a { color: #a3e600; }
.trolls-comment-nav { display: flex; justify-content: space-between; margin: 0 0 2rem; }
.trolls-comments .comment-notes, .trolls-comments .logged-in-as, .trolls-comments .must-log-in { color: #8f9288; font-size: .9rem; }
.trolls-comments .comment-form { display: grid; gap: 1rem; }
.trolls-comments .comment-form p { margin: 0; }
.trolls-comments .comment-form label { color: #d7d9d1; display: block; font-size: .85rem; font-weight: 700; margin-bottom: .4rem; }
.trolls-comments .comment-form input[type="text"], .trolls-comments .comment-form input[type="email"], .trolls-comments .comment-form input[type="url"], .trolls-comments .comment-form textarea { background: #10110e; border: 1px solid #34372f; border-radius: .4rem; color: #f2f2ed; padding: .8rem .9rem; width: 100%; }
.trolls-comments .comment-form textarea { min-height: 150px; resize: vertical; }
.trolls-comments .comment-form input:focus, .trolls-comments .comment-form textarea:focus { border-color: #a3e600; outline: 2px solid rgba(163,230,0,.15); }
.trolls-comments .submit { background: #a3e600; border: 0; border-radius: .4rem; color: #0b0c09; cursor: pointer; font-weight: 800; padding: .8rem 1.25rem; }
.trolls-comments .submit:hover { background: #b7f51b; }
.trolls-contact-notice { border: 1px solid; border-radius: .45rem; font-size: .9rem; line-height: 1.5; margin-bottom: 1rem; padding: .85rem 1rem; }
.trolls-contact-success { background: rgba(163,230,0,.08); border-color: rgba(163,230,0,.45); color: #c9f36a; }
.trolls-contact-error { background: rgba(239,68,68,.08); border-color: rgba(239,68,68,.45); color: #fca5a5; }
@media (max-width: 639px) {
  .trolls-news-card { flex-direction: column; gap: 1rem; padding: 1rem; }
  .trolls-news-cover { flex-basis: auto; height: 180px; width: 100%; }
  .trolls-news-track { max-height: 680px; }
  .trolls-comment-list .children { margin-left: 1rem; }
}
