/* Global subtle enhancements: selection, scrollbar, focus ring, link hover */

/* Selection color (adapts to color scheme) */
::selection { background: rgba(0,255,65,.28); color: #0b0b0b; }
@media (prefers-color-scheme: dark) { ::selection { background: rgba(0,255,65,.32); color: #0b0b0b; } }

/* Scrollbar (Chromium/WebKit) */
@media (pointer: fine) {
  * { scrollbar-width: thin; scrollbar-color: rgba(0,255,65,.45) rgba(0,0,0,.15); }
  @supports selector(::-webkit-scrollbar) {
    ::-webkit-scrollbar { width: 10px; height: 10px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgba(0,255,65,.55), rgba(0,128,255,.45)); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
    ::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, rgba(0,255,65,.72), rgba(0,128,255,.6)); }
  }
}

/* Accessible focus ring */
:where(a, button, .btn, .article-button, input, textarea, select, [role="button"]) :focus { outline: none; }
:where(a, button, .btn, .article-button, input, textarea, select, [role="button"]):focus-visible {
  outline: 2px solid rgba(0,255,65,.9);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(0,255,65,.18);
}

/* Link hover neon shimmer (subtle) */
a:not(.btn):not(.article-button) {
  position: relative;
  transition: color .2s ease;
}
a:not(.btn):not(.article-button):hover {
  color: var(--accent-green, #00ff41);
}
a:not(.btn):not(.article-button)::after {
  content: '';
  position: absolute; left: 0; bottom: -2px; height: 1px; width: 100%;
  background: linear-gradient(90deg, transparent, rgba(0,255,65,.6), transparent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
a:not(.btn):not(.article-button):hover::after { transform: scaleX(1); }

/* Lucide Icons Global Styling */
.lucide {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  display: inline-block;
  stroke-width: 1.75;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  filter: drop-shadow(0 0 4px color-mix(in oklab, currentColor 40%, transparent));
}

.btn .lucide, .action-btn .lucide, .article-button .lucide, .related-link .lucide {
  margin-right: 0.5rem;
  vertical-align: middle;
}

.btn:hover .lucide, .action-btn:hover .lucide, .article-button:hover .lucide {
  transform: scale(1.15) rotate(-5deg);
  filter: drop-shadow(0 0 8px color-mix(in oklab, currentColor 70%, transparent));
}

.skill-icon .lucide {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--accent-green, #00ff41);
  filter: drop-shadow(0 0 6px color-mix(in oklab, var(--accent-green, #00ff41) 50%, transparent));
}

.skill-card:hover .skill-icon .lucide {
  transform: scale(1.15) translateY(-2px);
  filter: drop-shadow(0 0 12px color-mix(in oklab, var(--accent-green, #00ff41) 80%, transparent));
}

.article-icon .lucide {
  width: 2.2rem;
  height: 2.2rem;
  color: var(--accent-green, #00ff41);
  filter: drop-shadow(0 0 5px color-mix(in oklab, var(--accent-green, #00ff41) 40%, transparent));
}

.article-card:hover .article-icon .lucide {
  transform: scale(1.1) rotate(3deg);
  filter: drop-shadow(0 0 10px color-mix(in oklab, var(--accent-green, #00ff41) 80%, transparent));
}

.search-icon .lucide {
  width: 1.2rem;
  height: 1.2rem;
  color: var(--text-muted, #888);
}

.search-box:focus-within .search-icon .lucide,
.search-box.searching .search-icon .lucide {
  color: var(--accent-green, #00ff41);
  transform: scale(1.1);
  filter: drop-shadow(0 0 8px color-mix(in oklab, var(--accent-green, #00ff41) 60%, transparent));
}
