/*
 * custom.css — Signal Dark
 * Site-specific overrides loaded after template.css.
 */

/* ══════════════════════════════════════════
   BLOG VIEW — Category blog & featured
══════════════════════════════════════════ */

/* Consistent spacing between blog items */
body:not(.view-article) .taid-component-panel .blog-item,
body:not(.view-article) .taid-component-panel .blog-items .blog-item {
  border-bottom: 1px solid var(--border);
  padding-bottom: 2.5rem;
  margin-bottom: 2.5rem;
}
body:not(.view-article) .taid-component-panel .blog-item:last-child,
body:not(.view-article) .taid-component-panel .blog-items .blog-item:last-child {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

/* Article metadata — uniform spacing */
.taid-component-panel .blog-item .article-info {
  margin-bottom: .75rem;
}

/* Tags — consistent gap */
.taid-component-panel .blog-item .tags {
  margin-top: 1rem;
  margin-bottom: 0;
}

/* Hide the second article-info block (hits counter below intro text) */
.taid-component-panel .blog-item .item-content > dl.article-info ~ dl.article-info {
  display: none !important;
}

/* Hide Akeeba Engage comment counters (extension removed, CSS kept for demo) */
.akenage-comments-counter--blog {
  display: none !important;
}

/* Intro text — consistent line height and spacing */
.taid-component-panel .blog-item .item-content > p {
  font-size: .94rem;
  line-height: 1.78;
  color: var(--text-soft);
  margin-bottom: 0;
}

/* Headings inside blog item intros — scale down so they never compete with the title link */
body:not(.view-article) .taid-component-panel .blog-item .item-content > h2,
body:not(.view-article) .taid-component-panel .blog-item .item-content h2:not(.item-title) {
  font-size: 1.05rem;
  margin-top: 1.2rem;
  margin-bottom: .5rem;
  color: var(--text-soft);
}
body:not(.view-article) .taid-component-panel .blog-item .item-content > h3,
body:not(.view-article) .taid-component-panel .blog-item .item-content h3 {
  font-size: .95rem;
  margin-top: 1rem;
  margin-bottom: .4rem;
  color: var(--text-soft);
}
body:not(.view-article) .taid-component-panel .blog-item .item-content > h4,
body:not(.view-article) .taid-component-panel .blog-item .item-content > h5,
body:not(.view-article) .taid-component-panel .blog-item .item-content > h6 {
  font-size: .9rem;
  margin-top: .8rem;
  margin-bottom: .35rem;
  color: var(--muted);
}

/* ══════════════════════════════════════════
   ARTICLE TITLE LINKS — clearly clickable
══════════════════════════════════════════ */
body:not(.view-article) .taid-component-panel h2 a,
body:not(.view-article) .taid-component-panel .page-header h2 a {
  color: var(--violet-lt) !important;
  text-decoration: none;
  transition: color .2s ease;
}
body:not(.view-article) .taid-component-panel h2 a:hover,
body:not(.view-article) .taid-component-panel .page-header h2 a:hover {
  color: var(--cyan-lt) !important;
}

/* ══════════════════════════════════════════
   ARTICLE TITLE SIZING — clean hierarchy
══════════════════════════════════════════ */

/* Leading article titles */
body:not(.view-article) .taid-component-panel .blog-featured .page-header h2,
body:not(.view-article) .taid-component-panel .blog-featured .item-title a {
  font-size: clamp(1.3rem, 2.2vw, 1.7rem);
  line-height: 1.18;
  letter-spacing: -.02em;
}

/* Intro article titles */
body:not(.view-article) .taid-component-panel .blog-items .page-header h2,
body:not(.view-article) .taid-component-panel .blog-items .item-title a {
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  line-height: 1.2;
  letter-spacing: -.015em;
}

/* ══════════════════════════════════════════
   PAGE HEADER — category title
══════════════════════════════════════════ */
.taid-component-panel > .page-header {
  margin-bottom: 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--border);
}

/* ══════════════════════════════════════════
   ARTICLE PAGE — title (h1)
══════════════════════════════════════════ */
.view-article .taid-component-panel .page-header h1 {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  line-height: 1.12;
  letter-spacing: -.02em;
  margin-bottom: 1rem;
}

/* Article metadata — breathing room below */
.view-article .taid-component-panel > dl.article-info {
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}

/* Hide hits on single article view too */
.view-article .taid-component-panel .article-info .hits {
  display: none !important;
}

/* ══════════════════════════════════════════
   ARTICLE BODY — heading hierarchy
══════════════════════════════════════════ */
.view-article .taid-component-panel .com-content-article__body h2 {
  font-size: clamp(1.2rem, 1.8vw, 1.55rem);
  margin-top: 2.5rem;
  margin-bottom: .85rem;
}
.view-article .taid-component-panel .com-content-article__body h3 {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  margin-top: 2rem;
  margin-bottom: .7rem;
}
.view-article .taid-component-panel .com-content-article__body h4 {
  font-size: clamp(.95rem, 1.2vw, 1.1rem);
  margin-top: 1.75rem;
  margin-bottom: .6rem;
}
.view-article .taid-component-panel .com-content-article__body h5 {
  font-size: clamp(.88rem, 1vw, 1rem);
  margin-top: 1.5rem;
  margin-bottom: .5rem;
  color: var(--text-soft);
}
.view-article .taid-component-panel .com-content-article__body h6 {
  font-size: clamp(.8rem, .9vw, .92rem);
  margin-top: 1.25rem;
  margin-bottom: .45rem;
  color: var(--text-soft);
  letter-spacing: .02em;
}

/* First heading in article body — less top margin */
.view-article .taid-component-panel .com-content-article__body > h2:first-child,
.view-article .taid-component-panel .com-content-article__body > h3:first-child {
  margin-top: .5rem;
}

/* ══════════════════════════════════════════
   ARTICLE BODY — content polish
══════════════════════════════════════════ */

/* Max width for readability — long lines are hard to read */
.view-article .taid-component-panel .com-content-article__body {
  max-width: 72ch;
}

/* Strong text — slightly brighter */
.view-article .taid-component-panel .com-content-article__body strong {
  color: var(--text);
  font-weight: 600;
}

/* Lists — tighter spacing inside articles */
.view-article .taid-component-panel .com-content-article__body li {
  margin-bottom: .3em;
}
.view-article .taid-component-panel .com-content-article__body ul,
.view-article .taid-component-panel .com-content-article__body ol {
  margin-bottom: 1.4em;
}

/* Blockquote — tighter on mobile */
@media (max-width: 760px) {
  .taid-component-panel blockquote {
    padding: 1rem 1.2rem;
    margin: 1.5rem 0;
  }
}

/* Horizontal rules inside articles */
.view-article .taid-component-panel .com-content-article__body hr {
  border: none;
  border-top: 1px solid var(--border-md);
  margin: 2.5rem 0;
}

/* ══════════════════════════════════════════
   ARTICLE — lead paragraph (taid-intro class)
══════════════════════════════════════════ */
.view-article .taid-component-panel .taid-intro,
.view-article .taid-component-panel .com-content-article__body > p:first-child {
  font-size: 1.05rem;
  line-height: 1.8;
  color: var(--text);
  margin-bottom: 1.5em;
}

/* ══════════════════════════════════════════
   ARTICLE — tags at bottom
══════════════════════════════════════════ */
.view-article .taid-component-panel .tags {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

/* ══════════════════════════════════════════
   ARTICLE — prev/next navigation
══════════════════════════════════════════ */
.view-article .taid-component-panel .com-content-article__navigate {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

/* ══════════════════════════════════════════
   PAGINATION
══════════════════════════════════════════ */
.taid-component-panel .com-content-category-blog__navigation,
.taid-component-panel .com-content-blog__navigation {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--border);
}

/* ══════════════════════════════════════════
   RESPONSIVE — mobile polish
══════════════════════════════════════════ */
@media (max-width: 760px) {
  .taid-component-panel {
    padding: 1.5rem;
  }
  .view-article .taid-component-panel .page-header h1 {
    font-size: 1.5rem;
  }
  body:not(.view-article) .taid-component-panel .blog-item,
  body:not(.view-article) .taid-component-panel .blog-items .blog-item {
    padding-bottom: 1.75rem;
    margin-bottom: 1.75rem;
  }
}

/* ── Demo site: landing hero overrides ── */
.com-content-article:has(.taid-landing-hero) > .page-header {
  display: none;
}
.taid-component-panel:has(.taid-landing-hero) {
  overflow: visible;
  border: none;
  background: transparent;
  padding-top: 1.5rem;
}
.taid-demo-hub-cta .taid-btn-gradient {
  margin-bottom: 1rem;
}

/* ── Kunena: fix table display ── */
#kunena table.table,
#kunena .kfrontend table.table {
  display: table !important;
  table-layout: auto !important;
  width: 100% !important;
}

/* ── No-sidebar pages: constrain article content width for readability ── */
.taid-content-wrap:not(.taid-content-wrap--sidebar) .taid-component-panel {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

/* ── Sidebar: hide submenu toggle chevrons — items already visible ── */
.taid-sidebar .mod-menu__toggle-sub {
  display: none !important;
}
.taid-sidebar .mod-menu__sub {
  display: block !important;
  height: auto !important;
}
