/*
 * HNT.ROCKS dark-mode pilot – small visual polish after live review.
 * Color/contrast only. No layout, sizing or behavior changes.
 */

/* Comment rows must stay transparent. Only the actual comment bubble is a surface. */
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] :is(
  .comment-item,
  .real-comment-item,
  .real-comment-replies
) {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] :is(
  .comment-avatar,
  .real-comment-replies .comment-avatar
) {
  background: transparent !important;
  box-shadow: none !important;
}

/* Keep the reply tree visible without drawing a block behind the avatars. */
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .real-comment-replies::before,
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .real-comment-replies .comment-item::before {
  background: rgba(242, 232, 216, .48) !important;
}

/* ID-scoped selectors intentionally outrank the generic dark-mode .comment-item
   surface even when component CSS is loaded after the theme files. */
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] #commentsModal #commentsList,
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] #commentsModal #commentsList .real-comment-thread,
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] #commentsModal #commentsList .real-comment-replies,
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] #commentsModal #commentsList article.comment-item.real-comment-item {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] #commentsModal #commentsList article.comment-item.real-comment-item > .comment-bubble {
  border-color: var(--hnt-border-soft) !important;
  background: var(--hnt-surface-input) !important;
}

/* Agenda period tabs: readable dark surfaces instead of pale disabled-looking pills. */
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-row > button:not(.active) {
  border-color: var(--hnt-border-soft) !important;
  background: var(--hnt-surface-input) !important;
  color: var(--hnt-text) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-row > button:not(.active) b {
  color: var(--hnt-text) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-row > button:not(.active) small {
  color: var(--hnt-text-soft) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-row > button.active {
  border-color: rgba(242, 232, 216, .08) !important;
  background: #0d0d0c !important;
  color: var(--hnt-text-on-dark) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-row > button.active :is(b, small) {
  color: var(--hnt-text-on-dark) !important;
}

/* --------------------------------------------------------------------------
   Shared header dropdown icons
   -------------------------------------------------------------------------- */
html[data-theme="dark"] body[data-hnt-theme-pilot] header.site-header[data-hnt-shared-header] .main-nav-menu-icon {
  border: 1px solid var(--hnt-border-soft) !important;
  background: var(--hnt-surface-input) !important;
  color: var(--hnt-text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot] header.site-header[data-hnt-shared-header] .main-nav-menu-icon.yellow {
  border-color: rgba(216, 179, 79, .22) !important;
  background: rgba(216, 179, 79, .15) !important;
  color: var(--hnt-accent-strong) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot] header.site-header[data-hnt-shared-header] .main-nav-menu-icon.green {
  border-color: rgba(143, 189, 66, .22) !important;
  background: rgba(143, 189, 66, .14) !important;
  color: #a9cf69 !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot] header.site-header[data-hnt-shared-header] .main-nav-menu-icon.purple {
  border-color: rgba(165, 139, 207, .24) !important;
  background: rgba(165, 139, 207, .15) !important;
  color: #b9a3dc !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot] header.site-header[data-hnt-shared-header] .main-nav-menu-icon svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.6 !important;
  opacity: 1 !important;
}

/* --------------------------------------------------------------------------
   Agenda timeline – compact and expanded
   -------------------------------------------------------------------------- */
html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-axis::before {
  background: rgba(242, 232, 216, .48) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-axis > span {
  border-color: var(--hnt-border-medium) !important;
  background: var(--hnt-surface-input) !important;
  color: var(--hnt-text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-axis > span.dark {
  border-color: rgba(242, 232, 216, .12) !important;
  background: #0d0d0c !important;
  color: var(--hnt-text-on-dark) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-axis > span.yellow {
  border-color: rgba(216, 179, 79, .24) !important;
  background: rgba(216, 179, 79, .15) !important;
  color: var(--hnt-accent-strong) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-axis .time-dot.dark {
  border: 1px solid rgba(242, 232, 216, .12) !important;
  background: #0d0d0c !important;
  color: var(--hnt-text-on-dark) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded {
  border-color: var(--hnt-border-medium) !important;
  background: var(--hnt-surface-solid) !important;
  color: var(--hnt-text) !important;
  box-shadow: 0 24px 72px rgba(0, 0, 0, .46), 0 0 0 1px var(--hnt-border-soft) inset !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-expand-backdrop {
  background: rgba(0, 0, 0, .68) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded :is(
  .section-head h2,
  .hnt-agenda-copy h3
) {
  color: var(--hnt-text) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded :is(
  .hnt-agenda-copy p,
  .hnt-agenda-row small
) {
  color: var(--hnt-text-soft) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded .section-head .circle-button {
  border-color: var(--hnt-border-soft) !important;
  background: var(--hnt-surface-input) !important;
  color: var(--hnt-text) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded .hnt-agenda-card {
  border-color: var(--hnt-border-soft) !important;
  background: var(--hnt-surface-input) !important;
  color: var(--hnt-text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded .hnt-agenda-card.dark {
  background: #0d0d0c !important;
  color: var(--hnt-text-on-dark) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded .hnt-agenda-card.cup {
  background:
    repeating-linear-gradient(135deg, rgba(242, 232, 216, .14) 0 2px, transparent 2px 8px),
    var(--hnt-surface-input) !important;
}

html[data-theme="dark"] body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded .hnt-agenda-progress {
  background: var(--hnt-progress-track) !important;
}

/* The expanded agenda may still scroll on very small viewports, but its own
   visible scrollbar must never appear in either light or dark mode. */
body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  overscroll-behavior: contain !important;
}

body[data-hnt-theme-pilot="feed"] .hnt-agenda-panel.hnt-agenda-floating.is-expanded::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
