/* Blogify - Custom Styles */

/* Prose (Typography) */
.prose {
    --tw-prose-body: theme(--color-neutral-600);
    --tw-prose-headings: theme(--color-neutral-900);
    --tw-prose-links: theme(--color-neutral-900);
    --tw-prose-underline: theme(--color-neutral-900);
    line-height: 1.75;
    font-size: 1rem;
}
.prose h2 { font-size: 1.5rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 1rem; letter-spacing: -0.025em; line-height: 1.3; }
.prose h3 { font-size: 1.25rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; letter-spacing: -0.025em; line-height: 1.3; }
.prose p { margin-bottom: 1.25rem; }
.prose a { text-decoration: underline; text-underline-offset: 2px; }
.prose a:hover { opacity: 0.8; }
.prose blockquote {
    border-left: 3px solid #171717;
    padding-left: 1rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: #737373;
}
.prose ul, .prose ol { margin: 1.25rem 0; padding-left: 1.5rem; }
.prose li { margin-bottom: 0.375rem; }
.prose img { border-radius: 0.75rem; max-width: 100%; }
.prose hr { border-color: #e5e5e5; margin: 2rem 0; }
.prose code {
    background: #f5f5f5;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}
.prose pre {
    background: #171717;
    color: #fff;
    padding: 1rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 1.5rem 0;
}
.prose pre code { background: transparent; padding: 0; color: inherit; }

/* Line Clamp */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* TipTap Editor Styles */
.tiptap {
    outline: none;
    min-height: 400px;
    padding: 1rem 1.5rem;
}
.tiptap p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    color: #a3a3a3;
    pointer-events: none;
    height: 0;
}
.tiptap img {
    max-width: 100%;
    border-radius: 0.75rem;
    margin: 1rem 0;
}
.tiptap a {
    text-decoration: underline;
    cursor: pointer;
}

/* Custom Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d4d4d4; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #a3a3a3; }

/* Animations */
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
.animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }

/* Focus styles */
*:focus-visible {
    outline: 2px solid #171717;
    outline-offset: 2px;
}

/* Print styles */
@media print {
    header, footer, nav, .no-print { display: none !important; }
    main { padding: 0 !important; }
    .prose { max-width: 100% !important; }
}