/* ========================================
   App CSS — Tailwind CDN üzerine minimal ek
   ======================================== */

/* Scrollbar gizle (pills yatay kaydırma) */
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Line clamp (WebKit) */
.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;
}

/* Uzun URL/metinler kart ve tablo dışına taşmasın. */
.text-wrap-safe {
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* Kategori pill durumları */
.pill {
    color: #9CA3AF;
    background: transparent;
}
.pill:hover {
    color: #4B5563;
}
.pill.active {
    color: #fff;
    background-color: #2563EB;
}

/* Giriş animasyonu */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-up {
    animation: fadeUp 0.3s ease-out both;
}

/* Sticky bar alt çizgi (scroll sonrası) */
#sticky-bar.scrolled {
    border-bottom: 1px solid #F3F4F6;
}

/* Admin panel ek stilleri */
.admin-table th {
    font-weight: 500;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #9CA3AF;
    padding: 0.75rem 1rem;
    text-align: left;
}

.admin-table td {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: inherit;
    border-top: 1px solid #F3F4F6;
}

.dark .admin-table td {
    border-top-color: #374151; /* gray-700 */
}

.admin-table tr:hover td {
    background-color: #F9FAFB;
}

.dark .admin-table tr:hover td {
    background-color: #374151; /* gray-700 for better visibility in dark mode */
}

/* Flash mesajlar */
.flash-message {
    animation: fadeUp 0.3s ease-out both;
}