/* devdick portfolio custom styles */

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0a0a0a; }
::-webkit-scrollbar-thumb { background: rgba(185, 234, 46, 0.3); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: rgba(185, 234, 46, 0.6); }

::selection { background: rgba(185, 234, 46, 0.3); color: #fff; }

.article-content { color: #d1d5db; line-height: 1.8; }
.article-content h1, .article-content h2, .article-content h3, .article-content h4 { color: #fff; font-weight: 700; margin-top: 2em; margin-bottom: 0.75em; }
.article-content h1 { font-size: 2rem; }
.article-content h2 { font-size: 1.65rem; }
.article-content h3 { font-size: 1.35rem; }
.article-content p { margin-bottom: 1.25em; }
.article-content a { color: #b9ea2e; text-decoration: underline; }
.article-content a:hover { color: #d2f56b; }
.article-content code { background: rgba(185, 234, 46, 0.1); color: #b9ea2e; padding: 0.15em 0.4em; border-radius: 0.25em; font-size: 0.9em; }
.article-content pre { background: #0a0a0a; border: 1px solid rgba(255,255,255,0.1); border-radius: 0.75em; padding: 1.25em; overflow-x: auto; margin: 1.5em 0; }
.article-content pre code { background: transparent; color: #d1d5db; padding: 0; }
.article-content ul, .article-content ol { margin: 1.25em 0; padding-left: 1.5em; }
.article-content ul { list-style: disc; }
.article-content ol { list-style: decimal; }
.article-content li { margin-bottom: 0.5em; }
.article-content blockquote { border-left: 3px solid #b9ea2e; padding: 0.5em 1em; margin: 1.5em 0; color: #d1d5db; font-style: italic; background: rgba(255,255,255,0.02); border-radius: 0 0.5em 0.5em 0; }
.article-content img { border-radius: 0.75em; margin: 1.5em 0; max-width: 100%; }
.article-content table { width: 100%; border-collapse: collapse; margin: 1.5em 0; }
.article-content th, .article-content td { border: 1px solid rgba(255,255,255,0.1); padding: 0.65em 1em; text-align: left; }
.article-content th { background: rgba(255,255,255,0.03); color: #fff; }

.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }