/*
  Gridzone (HTMLy) - Dark-mode-only overrides
  This file intentionally overrides the original light palette in style.css.
*/

/* Force dark color-scheme for built-in form controls */
html.dark, body.dark { color-scheme: dark; }

html.dark body,
body.dark {
  background: #0b0f14;
  color: rgba(255, 255, 255, 0.78);
}

/* Remove light-mode top border that shows as a white line */
html.dark #wrapper,
body.dark #wrapper {
  border-top-color: rgba(255,255,255,0.0);
}

/* Links */
html.dark a,
body.dark a { color: rgba(255, 255, 255, 0.88); }
html.dark a:hover,
body.dark a:hover { color: #ffffff; }

/* Selection */
html.dark ::selection,
body.dark ::selection { background: rgba(255,255,255,0.18); color: #fff; }

/* Global separators/borders */
html.dark hr,
body.dark hr,
html.dark .entry hr,
body.dark .entry hr { background: rgba(255,255,255,0.10); }

/* Header + left sidebar rail */
html.dark #header,
body.dark #header {
  background: rgba(17, 22, 30, 0.92);
  border-bottom-color: rgba(255,255,255,0.10);
  box-shadow: 0 0 16px rgba(0,0,0,0.35);
}

/* Mobile-only Home link (placed next to search button) */
html.dark .mobile-home-link,
body.dark .mobile-home-link { display: none; }

/* Navigation: the theme uses dark text for active/mobile items; force light text in dark mode */
html.dark .nav-menu a,
body.dark .nav-menu a { color: rgba(255,255,255,0.78); }
html.dark .nav-menu a:hover,
body.dark .nav-menu a:hover { color: #ffffff; }

html.dark .menu .active a,
body.dark .menu .active a,
html.dark .nav-menu .active > a,
body.dark .nav-menu .active > a,
html.dark .nav-menu li.current_page_item > a,
body.dark .nav-menu li.current_page_item > a,
html.dark .nav-menu li.current-menu-item > a,
body.dark .nav-menu li.current-menu-item > a {
  color: #ffffff;
}

/* Mobile menu (Gridzone sets these to #333) */
html.dark .nav-menu.mobile ul li a,
body.dark .nav-menu.mobile ul li a { color: rgba(255,255,255,0.85); }
html.dark .nav-menu.mobile ul li .menu-item-wrapper,
body.dark .nav-menu.mobile ul li .menu-item-wrapper { border-bottom-color: rgba(255,255,255,0.08); }
html.dark .nav-menu.mobile ul button,
html.dark .nav-menu.mobile ul ul button,
body.dark .nav-menu.mobile ul button,
body.dark .nav-menu.mobile ul ul button { border-left-color: rgba(255,255,255,0.08); }
html.dark .nav-menu.mobile ul ul,
body.dark .nav-menu.mobile ul ul { background: rgba(0,0,0,0.15); }

html.dark .s2,
body.dark .s2 {
  background: rgba(17, 22, 30, 0.92);
  box-shadow: 0 0 16px rgba(0,0,0,0.35), 1px 0 rgba(255,255,255,0.06);
}

html.dark .site-title a,
body.dark .site-title a,
html.dark .site-description,
body.dark .site-description {
  color: rgba(255,255,255,0.9);
}

/* Front-page profile block */
html.dark #profile-name,
body.dark #profile-name {
  color: #ffffff;
}

/* Social links */
html.dark .social-links .social-tooltip,
body.dark .social-links .social-tooltip { color: rgba(255,255,255,0.75); }
html.dark .social-links .social-tooltip:hover,
body.dark .social-links .social-tooltip:hover { color: #fff; }

html.dark .s2 .social-links li:before,
body.dark .s2 .social-links li:before { background: rgba(255,255,255,0.06); }

html.dark .s2 .social-links .social-tooltip:hover,
body.dark .s2 .social-links .social-tooltip:hover {
  background: rgba(255,255,255,0.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), inset 0 -1px 0 rgba(255,255,255,0.04), 0 1px 0 rgba(0,0,0,0.25);
  color: #fff;
}

/* RSS / Social logo icons (e.g. .social-logo-feed) */
html.dark .s2 .social-logo a,
body.dark .s2 .social-logo a {
  color: rgba(255,255,255,0.80);
  background: transparent;
}
html.dark .s2 .social-logo a:hover,
body.dark .s2 .social-logo a:hover {
  color: #ffffff;
  background: rgba(255,255,255,0.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), inset 0 -1px 0 rgba(255,255,255,0.04), 0 1px 0 rgba(0,0,0,0.25);
}

/* Search UI */
html.dark .toggle-search,
body.dark .toggle-search {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
}
html.dark .toggle-search .svg-icon,
body.dark .toggle-search .svg-icon { fill: rgba(255,255,255,0.8); }
html.dark .toggle-search.active,
body.dark .toggle-search.active { background: rgba(255,255,255,0.08); }

html.dark .search-expand,
body.dark .search-expand {
  /* Solid dark so underlying content doesn't reduce readability */
  background: rgb(17, 22, 30);
}
html.dark .search-expand .themeform input,
body.dark .search-expand .themeform input {
  background: rgb(11, 15, 19);
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.85);
}

/* Desktop: make the expanded search input match the search button height */
html.dark .search-expand .themeform.searchform div input,
body.dark .search-expand .themeform.searchform div input {
  height: 60px;
  line-height: 60px;
  padding-left: 52px; /* room for magnifier */
}

/* Center the magnifier icon inside the input */
html.dark .themeform.searchform div:after,
body.dark .themeform.searchform div:after {
  top: 50%;
  transform: translateY(-50%);
  line-height: 1;
}

/* Desktop: align the expanded search bar vertically with the search button */
@media only screen and (min-width: 720px) {
  html.dark .search-expand,
  body.dark .search-expand {
    /* remove theme padding that pushes the input down */
    padding: 0;
    height: 60px;
    align-items: stretch;
    border-radius: 10px;
  }

  html.dark .search-expand-inner,
  body.dark .search-expand-inner {
    width: 100%;
    display: flex;
  }

  html.dark .search-expand .themeform.searchform,
  body.dark .search-expand .themeform.searchform {
    width: 100%;
    display: flex;
    margin: 0;
  }

  html.dark .search-expand .themeform.searchform div,
  body.dark .search-expand .themeform.searchform div {
    width: 100%;
    display: flex;
  }
}

/* Forms */
html.dark .themeform label,
body.dark .themeform label { color: rgba(255,255,255,0.9); }

html.dark .themeform input[type="search"],
html.dark .themeform input[type="text"],
html.dark .themeform input[type="password"],
html.dark .themeform input[type="email"],
html.dark .themeform input[type="url"],
html.dark .themeform input[type="tel"],
html.dark .themeform input[type="number"],
html.dark .themeform select,
html.dark .themeform textarea,
body.dark .themeform input[type="search"],
body.dark .themeform input[type="text"],
body.dark .themeform input[type="password"],
body.dark .themeform input[type="email"],
body.dark .themeform input[type="url"],
body.dark .themeform input[type="tel"],
body.dark .themeform input[type="number"],
body.dark .themeform select,
body.dark .themeform textarea {
  background: rgba(0,0,0,0.35);
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.82);
}

html.dark .themeform input[type="search"]:focus,
html.dark .themeform input[type="text"]:focus,
html.dark .themeform input[type="password"]:focus,
html.dark .themeform input[type="email"]:focus,
html.dark .themeform input[type="url"]:focus,
html.dark .themeform input[type="tel"]:focus,
html.dark .themeform input[type="number"]:focus,
html.dark .themeform select:focus,
html.dark .themeform textarea:focus,
body.dark .themeform input[type="search"]:focus,
body.dark .themeform input[type="text"]:focus,
body.dark .themeform input[type="password"]:focus,
body.dark .themeform input[type="email"]:focus,
body.dark .themeform input[type="url"]:focus,
body.dark .themeform input[type="tel"]:focus,
body.dark .themeform input[type="number"]:focus,
body.dark .themeform select:focus,
body.dark .themeform textarea:focus {
  border-color: rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.92);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.12);
}

/* Page title + notebox */
html.dark .page-title span,
body.dark .page-title span,
html.dark .notebox,
body.dark .notebox { color: rgba(255,255,255,0.65); }

html.dark h1, html.dark h2, html.dark h3, html.dark h4, html.dark h5, html.dark h6,
body.dark h1, body.dark h2, body.dark h3, body.dark h4, body.dark h5, body.dark h6 {
  color: rgba(255,255,255,0.92);
}

/* Cards / surfaces */
html.dark .post-wrapper,
body.dark .post-wrapper,
html.dark .masonry-item .masonry-inner,
body.dark .masonry-item .masonry-inner,
html.dark .sidebar .widget,
body.dark .sidebar .widget {
  background: rgba(17, 22, 30, 0.92);
  box-shadow: 0 0 18px rgba(0,0,0,0.38);
}

html.dark .masonry-item .entry-excerpt,
body.dark .masonry-item .entry-excerpt,
html.dark .masonry-item .entry-meta,
body.dark .masonry-item .entry-meta,
html.dark .entry-header .entry-meta,
body.dark .entry-header .entry-meta { color: rgba(255,255,255,0.62); }

html.dark .masonry-item .entry-meta li a,
body.dark .masonry-item .entry-meta li a,
html.dark .entry-header .entry-meta a,
body.dark .entry-header .entry-meta a { color: rgba(255,255,255,0.70); }

/* Category/Tag "pills" (meta + post tags): darken background so text is readable */
html.dark .entry-header .entry-meta .entry-category a,
body.dark .entry-header .entry-meta .entry-category a,
html.dark .masonry-item .entry-category a,
body.dark .masonry-item .entry-category a,
html.dark .post-tags a,
body.dark .post-tags a {
  background: rgb(11, 15, 19);
  color: rgba(255,255,255,0.88);
}

html.dark .entry-header .entry-meta .entry-category a:hover,
body.dark .entry-header .entry-meta .entry-category a:hover,
html.dark .masonry-item .entry-category a:hover,
body.dark .masonry-item .entry-category a:hover,
html.dark .post-tags a:hover,
body.dark .post-tags a:hover {
  background: rgb(17, 22, 30);
  color: #ffffff;
}

/* Entry text */
html.dark .entry,
body.dark .entry { color: rgba(255,255,255,0.78); }
html.dark .entry a,
body.dark .entry a { color: #ff2aa6; box-shadow: 0 1px 0 rgba(255, 42, 166, 0.45); }
html.dark .entry a:hover,
body.dark .entry a:hover { color: #ff62c0; box-shadow: 0 1px 0 rgba(255, 98, 192, 0.65); }

/* Blockquote */
html.dark .entry blockquote,
body.dark .entry blockquote { color: rgba(255,255,255,0.70); }
html.dark .entry blockquote p,
body.dark .entry blockquote p { color: rgba(255,255,255,0.82); }
html.dark .entry blockquote:before,
body.dark .entry blockquote:before { color: rgba(255,255,255,0.22); }

/* Code blocks */
html.dark .entry pre,
body.dark .entry pre {
  background: rgba(0,0,0,0.35);
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.80);
}
html.dark .entry code,
body.dark .entry code { color: rgba(255,255,255,0.90); }

/* Tables */
html.dark .entry table td,
html.dark .entry table th,
body.dark .entry table td,
body.dark .entry table th { border-color: rgba(255,255,255,0.10); }
html.dark .entry table tr.alt,
body.dark .entry table tr.alt { background: rgba(255,255,255,0.04); }

/* Article page: author bio + share + prev/next (these are light by default) */
html.dark .author-bio,
body.dark .author-bio {
  background: rgba(17, 22, 30, 0.92);
  color: rgba(255,255,255,0.70);
  box-shadow: 0 0 18px rgba(0,0,0,0.38);
}
html.dark .author-bio .bio-name,
body.dark .author-bio .bio-name { color: rgba(255,255,255,0.92); }
html.dark .author-bio .bio-desc,
body.dark .author-bio .bio-desc { color: rgba(255,255,255,0.70); }

html.dark .sharrre-container,
body.dark .sharrre-container {
  border-color: rgba(255,255,255,0.10);
  background: rgba(17, 22, 30, 0.92);
  box-shadow: 0 0 18px rgba(0,0,0,0.38);
}
html.dark .sharrre .count,
body.dark .sharrre .count {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.90);
}
html.dark .sharrre .count:after,
body.dark .sharrre .count:after { border-left-color: rgba(255,255,255,0.08); }
html.dark .sharrre .share,
body.dark .sharrre .share { color: rgba(255,255,255,0.80); }
html.dark .sharrre .box:hover,
body.dark .sharrre .box:hover { background: rgba(255,255,255,0.06)!important; }

html.dark .post-nav,
body.dark .post-nav {
  background: rgba(17, 22, 30, 0.92);
  box-shadow: 0 0 18px rgba(0,0,0,0.38);
}
html.dark .post-nav li.next a,
body.dark .post-nav li.next a { border-left-color: rgba(255,255,255,0.10); }
html.dark .post-nav li i,
body.dark .post-nav li i { color: rgba(255,255,255,0.35); }
html.dark .post-nav li a strong,
body.dark .post-nav li a strong { color: rgba(255,255,255,0.55); }
html.dark .post-nav li a span,
body.dark .post-nav li a span { color: rgba(255,255,255,0.88); }
html.dark .post-nav li a:hover span,
body.dark .post-nav li a:hover span { color: #ffffff; }
html.dark .post-nav li a:hover i,
body.dark .post-nav li a:hover i { color: rgba(255,255,255,0.70); }

/* Comments UI (if enabled) */
html.dark .comment-tabs li a,
body.dark .comment-tabs li a {
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.70);
}
html.dark .comment-tabs li span,
body.dark .comment-tabs li span {
  background: rgba(0,0,0,0.35);
  color: rgba(255,255,255,0.85);
}
html.dark #commentform,
body.dark #commentform {
  background: rgba(17, 22, 30, 0.92);
  color: rgba(255,255,255,0.75);
}

/* Pagination */
html.dark .pagination ul li a,
body.dark .pagination ul li a {
  background: rgba(255,255,255,0.06);
  box-shadow: 0 0 0 rgba(0,0,0,0);
}
html.dark .pagination a,
body.dark .pagination a { color: rgba(255,255,255,0.85); }

/* Main page next/prev "circle" buttons: make them darker for arrow contrast */
html.dark .pagination .wp-pagenavi a.next.page-numbers,
html.dark .pagination .wp-pagenavi a.prev.page-numbers,
body.dark .pagination .wp-pagenavi a.next.page-numbers,
body.dark .pagination .wp-pagenavi a.prev.page-numbers {
  /* Match blog "panel" dark-blue surface */
  background: rgb(17, 22, 30);
  color: #ffffff;
}

html.dark .pagination .wp-pagenavi a.next.page-numbers:hover,
html.dark .pagination .wp-pagenavi a.prev.page-numbers:hover,
body.dark .pagination .wp-pagenavi a.next.page-numbers:hover,
body.dark .pagination .wp-pagenavi a.prev.page-numbers:hover {
  background: rgb(26, 33, 45);
  color: #ffffff;
}

/* Footer */
html.dark #footer,
body.dark #footer { border-top-color: rgba(255,255,255,0.10); color: rgba(255,255,255,0.60); }
html.dark #footer-bottom #copyright,
html.dark #footer-bottom #credit,
body.dark #footer-bottom #copyright,
body.dark #footer-bottom #credit { color: rgba(255,255,255,0.60); }

html.dark #footer-bottom a,
body.dark #footer-bottom a { color: rgba(255,255,255,0.78); }
html.dark #footer-bottom a:hover,
body.dark #footer-bottom a:hover { color: #fff; }

html.dark #footer-bottom #back-to-top,
body.dark #footer-bottom #back-to-top {
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.85);
}

/* Mobile tweaks that set light backgrounds in responsive.css */
@media only screen and (max-width: 719px) {
  /* Mobile header control vertical alignment (shared offset) */
  html.dark,
  body.dark {
    --mobile-header-control-top: -60px;
  }

  /* Mobile: the theme adds a light border under the title; make it dark */
  html.dark .site-title,
  body.dark .site-title {
    border-bottom-color: rgb(11, 15, 19);
  }

  /* Use the mobile-only Home link; hide the full header menu on mobile */
  html.dark #wrap-nav-header,
  body.dark #wrap-nav-header {
    display: none !important;
  }

  html.dark .mobile-home-link,
  body.dark .mobile-home-link {
    display: block;
    position: absolute;
    right: 10px;
    top: var(--mobile-header-control-top);
    z-index: 103;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    color: rgba(255,255,255,0.90);
    background: transparent;
    border-radius: 10px;
  }
  html.dark .mobile-home-link:hover,
  body.dark .mobile-home-link:hover {
    color: #ffffff;
    background: rgba(255,255,255,0.06);
  }

  /* Align the search button container with the Home link */
  html.dark .toggle-search,
  body.dark .toggle-search {
    height: 44px;
    width: 44px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 10px;
    top: var(--mobile-header-control-top) !important;
  }
  html.dark .toggle-search .svg-icon,
  body.dark .toggle-search .svg-icon {
    display: block;
    margin: 0;
  }

  /* Mobile nav: hide the hamburger and keep the menu visible (e.g. just "Home") */
  html.dark .nav-menu.mobile > .menu-toggle,
  body.dark .nav-menu.mobile > .menu-toggle {
    display: none !important;
  }

  /* Theme sets `ul.menu { visibility:hidden; }` on mobile; override that */
  html.dark ul.menu,
  body.dark ul.menu {
    visibility: visible !important;
  }

  /* Prevent collapse-by-max-height when aria-expanded is false */
  html.dark .nav-menu.mobile > .menu-toggle ~ *,
  body.dark .nav-menu.mobile > .menu-toggle ~ * {
    max-height: none !important;
    overflow: visible !important;
  }

  html.dark .s2 .social-links,
  body.dark .s2 .social-links {
    background: rgba(17, 22, 30, 0.92);
    border-bottom-color: rgba(255,255,255,0.10);
  }

  /* Mobile: remove the whole bar that contains the RSS button (and any social-logo icons) */
  html.dark .s2 .social-logo.social-links,
  body.dark .s2 .social-logo.social-links {
    display: none !important;
  }

  html.dark .s2 .social-logo a,
  body.dark .s2 .social-logo a {
    background: transparent;
    border-bottom: none;
  }
}