/*
Theme Name: Toprecents - Multi-Niche Directory & Activity Feeds
Theme URI: https://toprecents.com/
Author: Toprecents Design Studio
Author URI: https://toprecents.com/
Description: A high-performance WordPress theme crafted for multi-niche directory sites, showcasing real-time community activity feeds, searchable categorized content discovery, user audit logs, and date/popularity filtering.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: toprecents
Tags: blog, directory, grid-layout, custom-menu, featured-images, theme-options, translation-ready, full-width-template
*/

:root {
  --tr-primary: #4f46e5;
  --tr-primary-hover: #4338ca;
  --tr-bg: #f8fafc;
  --tr-card: #ffffff;
  --tr-text-dark: #0f172a;
  --tr-text-muted: #64748b;
  --tr-border: #e2e8f0;
}

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: var(--tr-bg);
  color: var(--tr-text-dark);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
}

.toprecents-container {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

/* Post Card Styles */
.tr-post-card {
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid var(--tr-border);
  overflow: hidden;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s ease, border-color 0.2s ease;
}

.tr-post-card:hover {
  transform: translateY(-3px);
  border-color: #cbd5e1;
  box-shadow: 0 16px 30px -10px rgba(0, 0, 0, 0.08);
}

/* Smooth Category Pill Scroll */
.tr-category-scroll {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.tr-category-scroll::-webkit-scrollbar {
  height: 6px;
}
.tr-category-scroll::-webkit-scrollbar-thumb {
  background-color: #cbd5e1;
  border-radius: 9999px;
}

/* Active Category Pill */
.tr-cat-pill.active {
  background-color: var(--tr-primary) !important;
  color: #ffffff !important;
  border-color: var(--tr-primary) !important;
}

/* Modal Reader Animation */
.tr-modal-overlay {
  transition: opacity 0.2s ease;
}