/* ── Home Module ──────────────────────────────────────────────── */
.wit-home-module { max-width:1100px; margin:0 auto; padding:30px 15px; }
.wit-home-header { text-align:center; margin-bottom:24px; }
.wit-home-title { font-size:2rem; font-weight:700; color:#222; margin:0 0 8px; }
.wit-home-title span { color:#f0c040; }
.wit-home-title::after { content:''; display:block; width:80px; height:3px; background:#f0c040; margin:8px auto 0; }

.wit-home-body { display:flex; gap:24px; align-items:flex-start; }
.wit-home-cats { flex:2; }
.wit-home-latest { flex:1; display:flex; flex-direction:column; }

.wit-cat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.wit-cat-tile { position:relative; display:block; aspect-ratio:4/3; border-radius:12px; overflow:hidden; background:#ccc center/cover no-repeat; text-decoration:none; }
.wit-cat-tile::after { content:''; position:absolute; inset:0; background:rgba(0,0,0,.4); border-radius:12px; transition:.7s; }
.wit-cat-tile:hover::after { background:rgba(0,0,0,0); }
.wit-cat-tile-name { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1; width:100%; text-align:center; color:#fff; font-weight:600; font-size:1.1rem; text-transform:uppercase; letter-spacing:.5px; transition:.7s; }
.wit-cat-tile:hover .wit-cat-tile-name { text-shadow:0 0 7px #000; }

.wit-latest-item { display:flex; gap:14px; align-items:flex-start; text-decoration:none; color:inherit; background:#eee; padding:16px; margin-bottom:10px; }
.wit-latest-item:last-child { margin-bottom:0; }
.wit-latest-item:hover .wit-latest-title { color:#000; }
.wit-latest-icon { width:50px; height:50px; flex-shrink:0; overflow:hidden; background:#ddd; }
.wit-latest-icon img { width:100%; height:100%; object-fit:cover; }
.wit-latest-icon-placeholder { width:100%; height:100%; background:#ddd; }
.wit-latest-info { display:flex; flex-direction:column; gap:4px; }
.wit-latest-cat { font-size:.78rem; font-weight:700; color:#000; letter-spacing:.5px; text-transform:uppercase; }
.wit-latest-title { font-size:.92rem; color:#6a6a6a; line-height:1.45; padding-top:4px; }

.wit-home-footer { text-align:center; margin-top:28px; }
.wit-view-all-btn { display:inline-block; background:#f0c040; color:#222; font-weight:700; padding:12px 36px; border-radius:4px; text-decoration:none; text-transform:uppercase; letter-spacing:.5px; font-size:.95rem; }
.wit-view-all-btn:hover { background:#e0b030; color:#111; }

/* ── Listing Page — Search Header ────────────────────────────── */
.wit-listing-wrap { max-width:1200px; margin:0 auto; padding:24px 15px; }

.wit-search-header { text-align:center; background:#f9f9f9; border-radius:12px; padding:40px 24px; margin-bottom:32px; }
.wit-search-header h1 { font-size:2.2rem; font-weight:700; color:#222; margin:0 0 10px; }
.wit-search-desc { color:#666; font-size:.95rem; max-width:600px; margin:0 auto 20px; line-height:1.6; }
.wit-search-desc p { margin:0 0 10px; color:inherit; font-size:inherit; line-height:inherit; }
.wit-search-desc p:last-child { margin-bottom:0; }
.wit-search-bar { position:relative; max-width:560px; margin:0 auto; }
.wit-search-inner { display:flex; align-items:center; background:#fff; border:2px solid #eee; border-radius:8px; overflow:hidden; }
.wit-search-inner:focus-within { border-color:#f0c040; }
.wit-search-icon { padding:0 10px 0 14px; color:#aaa; font-style:normal; font-size:1rem; }
.wit-search-inner input { flex:1; border:none; padding:12px 8px; font-size:1rem; outline:none; background:transparent; }
.wit-search-btn { background:#f0c040; border:none; padding:12px 20px; font-weight:700; cursor:pointer; font-size:.9rem; white-space:nowrap; }
.wit-search-btn:hover { background:#e0b030; }
.wit-search-dropdown { position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid #e0e0e0; border-top:none; border-radius:0 0 8px 8px; box-shadow:0 4px 12px rgba(0,0,0,.1); z-index:100; text-align:left; }
.wit-search-header-row { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; border-bottom:1px solid #f0f0f0; background:#fafafa; }
.wit-search-count { font-size:.85rem; color:#555; }
.wit-search-count strong { color:#222; }
.wit-search-view-all { font-size:.82rem; color:#888; text-decoration:none; white-space:nowrap; margin-left:10px; }
.wit-search-view-all:hover { color:#f0c040; text-decoration:underline; }
.wit-search-item { display:block; padding:10px 14px; text-decoration:none; color:#333; font-size:.9rem; border-bottom:1px solid #f5f5f5; }
.wit-search-item:last-child { border-bottom:none; }
.wit-search-item:hover { background:#fafafa; color:#222; }
.wit-search-no-result { padding:16px 14px; text-align:center; color:#888; font-size:.9rem; }

/* ── Listing Page — Two-column layout ────────────────────────── */
.wit-two-col-layout { display:flex; gap:32px; align-items:flex-start; }
.wit-left-col { flex:1; min-width:0; }
.wit-right-col { width:280px; flex-shrink:0; position:sticky; top:20px; }

.wit-section-title { font-size:1.3rem; font-weight:700; color:#222; margin:0 0 16px; border-left:4px solid #f0c040; padding-left:10px; }
.wit-sidebar-heading { font-size:1.1rem; font-weight:700; color:#222; margin:0 0 14px; border-bottom:2px solid #f0c040; padding-bottom:8px; }

/* Article cards grid — 3 columns in left col */
.wit-cards-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:16px; }

.wit-more-btn-wrap { text-align:center; margin-bottom:32px; }
.wit-more-btn { display:inline-block; padding:10px 28px; border:2px solid #f0c040; border-radius:4px; color:#222; font-weight:600; text-decoration:none; font-size:.9rem; }
.wit-more-btn:hover { background:#f0c040; }

/* All Article Topics — 3 columns of text links */
.wit-all-topics { margin-bottom:32px; }
.wit-topics-columns { display:flex; gap:24px; }
.wit-topics-col { flex:1; }
.wit-topics-col p { margin:6px 0; }
.wit-topics-col a { color:#333; text-decoration:none; font-size:.9rem; }
.wit-topics-col a:hover { color:#f0c040; }

/* Right sidebar — Popular Topics */
.wit-popular-topics { display:flex; flex-direction:column; gap:16px; margin-bottom:24px; }
.wit-popular-topic-card { display:flex; flex-direction:column; align-items:center; text-align:center; text-decoration:none; color:inherit; transition:opacity .2s; }
.wit-popular-topic-card:hover { opacity:.8; }
.wit-popular-topic-card img { width:90px !important; height:90px !important; object-fit:cover; border-radius:50% !important; display:block; margin-bottom:8px; }
.wit-popular-topic-no-img { width:90px; height:90px; background:#e8e8e8; border-radius:50%; margin-bottom:8px; }
.wit-popular-topic-card h4 { font-size:.9rem; font-weight:600; color:#222; margin:0; line-height:1.3; }
.wit-popular-topic-viewall { text-align:center; padding:10px 0 4px; }
.wit-popular-topic-viewall a { color:#888; font-size:.85rem; text-decoration:none; }
.wit-popular-topic-viewall a:hover { color:#f0c040; }

/* ── Article Card ─────────────────────────────────────────────── */
.wit-card { display:block; text-decoration:none; color:inherit; border-radius:10px; overflow:hidden; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.08); transition:transform .2s; }
.wit-card:hover { transform:translateY(-3px); }
.wit-card-media { position:relative; overflow:hidden; background:#eee; height:200px; }
.wit-card-media img { width:100%; height:200px; object-fit:cover; display:block; }
.wit-card-no-img { width:100%; height:200px; background:#f0f0f0; }
.wit-card-video-badge { position:absolute; top:8px; left:8px; background:rgba(0,0,0,.6); color:#fff; border-radius:50%; width:32px; height:32px; display:flex; align-items:center; justify-content:center; font-size:.9rem; z-index:1; }
.wit-card-text-on-photo { position:absolute; bottom:0; left:0; right:0; background:rgba(0,0,0,.45); color:#fff; font-size:.82rem; font-weight:600; padding:6px 10px; text-align:center; z-index:1; line-height:1.3; }
.wit-card-body { padding:12px; }
.wit-card-cat { font-size:.72rem; font-weight:700; color:#f0c040; text-transform:uppercase; display:block; margin-bottom:4px; }
.wit-card-label { font-size:.75rem; font-weight:700; text-transform:uppercase; display:block; margin-bottom:4px; letter-spacing:.03em; }
.wit-card-label--trending  { color:#222; }
.wit-card-label--latest    { color:#3a7bd5; }
.wit-card-label--favorites { color:#f0c040; }
.wit-card-title { font-size:.9rem; font-weight:600; color:#222; margin:0; line-height:1.35; }

/* ── Ads ─────────────────────────────────────────────────────── */
.wit-ad-wrap { margin:20px 0; text-align:center; }
.wit-ad-slot { display:block; }
.wit-ad-slot img { max-width:100%; height:auto; border-radius:4px; }
/* Desktop shows desktop image, hides mobile image */
.wit-ad-desktop { display:block; }
.wit-ad-mobile  { display:none; }
/* Vertical ad in sidebar */
.wit-ad-vertical img { max-width:100%; }

/* ── Category Page ────────────────────────────────────────────── */
.wit-category-wrap { max-width:1100px; margin:0 auto; padding:24px 15px; }
.wit-cat-title { font-size:1.8rem; font-weight:700; margin:8px 0 20px; }
.wit-subcat-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.wit-subcat-tab { display:flex; align-items:center; gap:6px; padding:8px 18px; border-radius:4px; border:2px solid #ddd; text-decoration:none; color:#555; font-size:.9rem; font-weight:600; transition:all .15s; }
.wit-subcat-tab.active { border-color:#f0c040; background:#f0c040; color:#222; }
.wit-subcat-tab:hover:not(.active) { border-color:#ccc; background:#f9f9f9; color:#222; }
.wit-tab-count { font-size:.82rem; font-weight:500; color:inherit; opacity:.75; }
.wit-cat-grid-posts { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.wit-no-results { color:#888; font-style:italic; padding:20px 0; }
.wit-cat-subtext { color:#666; font-size:.95rem; line-height:1.6; margin:-8px 0 20px; }
.wit-cat-subtext p { margin:0 0 8px; }

/* ── Article Page ─────────────────────────────────────────────── */
.wit-article-wrap { max-width:1100px; margin:0 auto; padding:24px 15px; }
.wit-article-layout { display:flex; gap:32px; align-items:flex-start; }
.wit-article-main { flex:1; min-width:0; }
.wit-article-sidebar { width:260px; flex-shrink:0; position:sticky; top:20px; }

.wit-article-cat-link { font-size:.8rem; font-weight:700; color:#f0c040; text-transform:uppercase; text-decoration:none; display:block; margin-bottom:8px; }
.wit-article-title { font-size:1.8rem; font-weight:700; color:#222; margin:0 0 8px; line-height:1.25; }
.wit-article-date { font-size:.82rem; color:#999; margin:0 0 20px; }
.wit-article-media { margin-bottom:24px; border-radius:10px; overflow:hidden; }
.wit-article-media img.wit-cover-img { width:100%; height:auto; display:block; }
.wit-video-wrap { position:relative; padding-bottom:56.25%; height:0; }
.wit-video-wrap iframe, .wit-video-wrap video { position:absolute; top:0; left:0; width:100%; height:100%; }
.wit-article-content { font-size:1rem; line-height:1.7; color:#333; }
.wit-article-content p { margin:0 0 1.2em; }
.wit-article-content p:last-child { margin-bottom:0; }
.wit-article-content h1,
.wit-article-content h2,
.wit-article-content h3,
.wit-article-content h4 { margin:1.4em 0 .5em; font-weight:700; line-height:1.3; color:#222; }
.wit-article-content ul,
.wit-article-content ol { margin:0 0 1.2em 1.5em; padding:0; }
.wit-article-content li { margin-bottom:.4em; }
.wit-article-content strong { font-weight:700; }
.wit-article-content a { color:#c0a060; text-decoration:underline; }
.wit-article-content a:hover { color:#8a6e3a; }
.wit-no-image { height:200px; background:#f0f0f0; border-radius:10px; }

/* ── Next Read (scrollable list, matches Angular) ─────────────── */
.wit-next-read-list { height:80vh; overflow-y:auto; list-style:none; padding:0; margin:0; }
.wit-nr-item { padding:0 0 20px; }
.wit-nr-header { display:flex; align-items:center; width:100%; margin:20px 0; }
.wit-nr-label { flex:1; text-align:center; padding-right:10px; font-size:.9rem; color:#444; white-space:nowrap; }
.wit-nr-line { flex:7; border:none; border-top:2px solid #000; margin:0; }
.wit-nr-cat { font-size:1.1rem; font-weight:500; text-transform:uppercase; margin-bottom:5px; display:block; color:inherit; text-decoration:none; }
.wit-nr-cat:hover { color:#f0c040; }
.wit-nr-title { font-size:1.8rem; font-weight:700; color:#111; margin:6px 0 4px; line-height:1.25; }
.wit-nr-date { font-size:.85rem; color:#666; margin-bottom:14px; }
.wit-nr-img { width:100%; height:400px; object-fit:cover; border-radius:5px; margin-bottom:16px; display:block; }
.wit-nr-content { font-size:1rem; line-height:1.7; color:#333; }
.wit-nr-content p { margin:0 0 1.2em; }
.wit-nr-item:hover .wit-nr-title { opacity:.8; }

/* ── Breadcrumb ───────────────────────────────────────────────── */
.wit-breadcrumb { font-size:.82rem; color:#999; margin-bottom:12px; }
.wit-breadcrumb a { color:#555; text-decoration:none; }
.wit-breadcrumb a:hover { color:#f0c040; }

/* ── Loading overlay & Toast ──────────────────────────────────── */
#wcs-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9000; align-items:center; justify-content:center; }
#wcs-overlay.active { display:flex !important; }
.wcs-spinner { width:44px; height:44px; border:4px solid rgba(255,255,255,.3); border-top-color:#FFD700; border-radius:50%; animation:wcs-spin .7s linear infinite; }
@keyframes wcs-spin { to { transform:rotate(360deg); } }
#wcs-toast-wrap { position:fixed; top:28px; right:28px; z-index:9100; display:flex; flex-direction:column; gap:10px; pointer-events:none; }
.wcs-toast { padding:12px 20px; border-radius:8px; color:#fff; font-size:14px; font-weight:500; box-shadow:0 4px 16px rgba(0,0,0,.2); min-width:200px; animation:wcs-ti .3s ease; }
.wcs-toast.success { background:#10b981; }
.wcs-toast.error   { background:#ef4444; }
@keyframes wcs-ti { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:none; } }

/* ── Comments Section ─────────────────────────────────────────── */
.wcs-comments-section { margin-top:36px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:20px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; font-size:15px; color:#1a1a2e; line-height:1.5; }
.wcs-comments-section *, .wcs-comments-section *::before, .wcs-comments-section *::after { box-sizing:border-box; }
.wcs-comments-header { display:flex !important; align-items:center; gap:8px; font-size:20px; font-weight:700; color:#212529; cursor:pointer; user-select:none; }
.wcs-comments-header i.fa-comment { color:#000; }
.wcs-chevron { margin-left:auto; font-size:13px; color:#9ca3af; transition:transform .25s ease; }
.wcs-comments-header.open .wcs-chevron { transform:rotate(180deg); }

/* Sort bar */
.wcs-sort-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 0 10px; border-bottom:1px solid #f0f0f0; margin-bottom:4px; }
.wcs-btn-add-comment { background:#FFD700 !important; color:#212529 !important; border:none !important; border-radius:4px; padding:10px 17px; font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; transition:background .18s; flex-shrink:0; }
.wcs-btn-add-comment:hover { background:#FFD700 !important; }
.wcs-sort-controls { display:flex; align-items:center; gap:10px; }
.wcs-sort-label { font-size:13px; color:#6b7280; font-weight:600; }
#wit-sort-select { border:1px solid #d1d5db !important; border-radius:6px; padding:5px 10px; font-size:13px; font-family:inherit; color:#1a1a2e; background:#fff; cursor:pointer; outline:none !important; }
#wit-sort-select:focus { border-color:#FFD700 !important; }
.wcs-no-comments { font-size:13px; color:#9ca3af; margin:12px 0 16px; }

/* Add comment form */
.wcs-add-comment { background:#d3d3d338; border:1px solid #e5e7eb; border-radius:12px; padding:20px; margin-bottom:16px; }
.wcs-reply-form-wrap { background:#f9fafb; border:1px solid #e5e7eb; border-radius:8px; padding:16px; margin:8px 0; }
.wcs-comment-actions { display:flex !important; gap:12px; justify-content:center; margin-top:40px; }
.wcs-btn-post { background:#FFD700 !important; color:#212529 !important; border:none !important; border-radius:4px; padding:9px 32px; font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; transition:background .18s; }
.wcs-btn-post:hover { background:#FFD700 !important; }
.wcs-btn-cancel { background:#fff !important; color:#212529 !important; border:1px solid #FFD700 !important; border-radius:4px; padding:9px 24px; font-size:15px; font-weight:600; cursor:pointer; font-family:inherit; }
.wcs-btn-cancel:hover { background:#f5f5f5 !important; }

/* Comment card */
.wcs-comment-card { border-bottom:1px solid #f3f4f6; padding:20px 0; }
.wcs-comment-card:last-of-type { border-bottom:none; }
.wcs-comment-top { display:flex !important; align-items:center; gap:10px; margin-bottom:8px; }
.wcs-comment-av { width:30px; height:30px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.wcs-comment-author { font-weight:700; font-size:14px; color:#1a1a2e; display:block; }
.wcs-comment-time { font-size:12px; color:#9ca3af; display:block; }
.wc-user-link { color:inherit; text-decoration:none; }
.wc-user-link:hover { text-decoration:underline; }

/* Comment / reply body */
.wcs-comment-body { font-size:14px; color:#374151; line-height:1.6; padding-left:0; margin-bottom:6px; }
.wcs-clampable.wcs-clamped { overflow:hidden; }

/* Action buttons */
.wcs-cmt-actions { display:flex !important; justify-content:flex-end; gap:16px; margin-top:8px; align-items:center; }
.wcs-cmt-action-btn { background:none !important; border:none !important; font-size:14px; color:#ccc !important; cursor:pointer; padding:3px 0; font-family:inherit; display:inline-flex !important; align-items:center; gap:5px; transition:color .18s; }
.wcs-cmt-action-btn:hover { color:#FFD700 !important; }
.wcs-delete-cmt-btn:hover, .wcs-delete-reply-btn:hover { color:#ef4444 !important; }
.wcs-see-toggle { color:#212529 !important; font-weight:600; padding:4px 0 !important; }
.wcs-see-toggle:hover { color:#212529 !important; }

/* Replies toggle */
.wcs-comment-replies-count { display:inline-flex !important; align-items:center; gap:6px; font-size:13px; font-weight:600; color:#ccc; cursor:pointer; margin-top:8px; user-select:none; transition:color .18s; }
.wcs-comment-replies-count:hover { color:#FFD700; }

/* Replies list */
.wcs-replies-list { margin:8px 0 4px 46px; padding-left:14px; border-left:2px solid #f3f4f6; }
.wcs-reply-card { padding:10px 0; border-bottom:1px solid #f3f4f6; }
.wcs-reply-card:last-of-type, .wcs-reply-card:last-child { border-bottom:none; }
.wcs-show-more-replies { display:inline-flex !important; align-items:center; gap:6px; font-size:13px; font-weight:600; color:#4b5563; cursor:pointer; margin-top:10px; user-select:none; transition:color .18s; }
.wcs-show-more-replies:hover { color:#f0b429; }

/* Show more comments */
.wcs-show-more-comments-wrap { text-align:center; margin:18px 0 4px; }
.wcs-btn-show-more-comments { background:#FFD700; color:#212529; border:none; border-radius:6px; text-transform:uppercase; padding:10px 22px; font-size:15px; box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12); font-weight:700; cursor:pointer; transition:background .18s,color .18s; }
.wcs-btn-show-more-comments:hover { background:#000; color:#fff; }

/* Edit/Confirm Modals */
.wcs-overlay-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9000; align-items:center; justify-content:center; padding:16px; }
.wcs-overlay-modal.open { display:flex !important; }
.wcs-edit-box { background:#fff; width:100%; max-width:640px; max-height:90vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.wcs-confirm-box { background:#fff; max-width:400px; width:100%; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.wcs-edit-head { display:flex !important; align-items:center; justify-content:space-between; background:#FFD700; padding:16px 20px; font-size:16px; font-weight:700; color:#1a1a2e; flex-shrink:0; }
.wcs-edit-head button { background:none !important; border:none !important; font-size:24px; line-height:1; cursor:pointer; color:#212529 !important; padding:0 4px; }
.wcs-edit-body { padding:20px; overflow-y:auto; flex:1; }
.wcs-edit-body textarea { width:100% !important; border:1px solid #d1d5db !important; border-radius:8px; padding:10px 12px !important; font-size:14px; font-family:inherit; outline:none !important; resize:vertical; box-sizing:border-box; }
.wcs-edit-body textarea:focus { border-color:#FFD700 !important; }
.wcs-edit-foot { display:flex !important; gap:12px; justify-content:center; padding:16px 20px; border-top:1px solid #f0f0f0; flex-shrink:0; }
.wcs-confirm-actions { display:flex !important; gap:12px; justify-content:center; margin-top:16px; }
.wcs-btn-danger { background:#ef4444 !important; color:#fff !important; border:none !important; border-radius:4px; padding:9px 24px; font-size:15px; font-weight:600; cursor:pointer; font-family:inherit; }
.wcs-btn-danger:hover { background:#dc2626 !important; }

/* TinyMCE mobile fixes */
@media (max-width:768px) {
    .mce-floatpanel.mce-window { transform-origin:top left !important; }
    .mce-toolbar-grp, .mce-top-part { overflow-x:auto !important; }
    .mce-tinymce, .mce-edit-area { max-width:100% !important; box-sizing:border-box !important; }
}

/* ── Category Load More / View Less ──────────────────────────── */
.wit-load-more-wrap { display:flex; justify-content:center; gap:12px; margin:32px 0 16px; flex-wrap:wrap; }
.wit-btn-load-more, .wit-btn-view-less { padding:11px 28px; border-radius:6px; font-size:.95rem; font-weight:600; cursor:pointer; border:2px solid #f0c040; transition:background .2s,color .2s; }
.wit-btn-load-more { background:#f0c040; color:#222; }
.wit-btn-load-more:hover { background:#e6b800; border-color:#e6b800; }
.wit-btn-load-more:disabled { opacity:.6; cursor:not-allowed; }
.wit-btn-view-less { background:#fff; color:#555; }
.wit-btn-view-less:hover { background:#f5f5f5; }

/* ── Pagination ───────────────────────────────────────────────── */
.wit-pagination { display:flex; justify-content:center; gap:8px; margin-top:20px; flex-wrap:wrap; }
.wit-page-btn { padding:7px 14px; border:1px solid #ddd; border-radius:4px; text-decoration:none; color:#333; font-size:.88rem; }
.wit-page-btn.active, .wit-page-btn:hover, .wit-page-btn-active { background:#f0c040; border-color:#f0c040; color:#222; }
.wit-page-ellipsis { padding:7px 4px; color:#999; font-size:.88rem; }
.wit-pagination-wrap { display:flex; justify-content:center; gap:8px; margin:28px 0; flex-wrap:wrap; align-items:center; }

/* ── View-all page ─────────────────────────────────────────────── */
.wit-view-all-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:32px; }
.wit-view-all-header-left { display:flex; align-items:center; gap:20px; flex:1; min-width:0; flex-wrap:wrap; }
.wit-view-all-header-right { width:280px; flex-shrink:0; margin:0; border-bottom:none; padding-bottom:0; }
.wit-view-all-title { font-size:1.6rem; font-weight:700; color:#222; margin:0; }
.wit-view-all-sort { display:flex; align-items:center; gap:8px; font-size:.9rem; color:#555; flex-shrink:0; white-space:nowrap; }
.wit-view-all-sort label { white-space:nowrap; }
.wit-view-all-sort select { padding:6px 10px; border:1px solid #ccc; border-radius:4px; font-size:.9rem; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width:900px) {
    .wit-two-col-layout { flex-direction:column; }
    .wit-right-col { width:100%; position:static; }
    .wit-popular-topics { flex-direction:row; flex-wrap:wrap; }
    .wit-popular-topic-card { width:calc(50% - 6px); }
    .wit-popular-topic-card img, .wit-popular-topic-no-img { width:90px !important; height:90px !important; }
}
@media (max-width:768px) {
    .wit-home-body { flex-direction:column; }
    .wit-cards-grid { grid-template-columns:repeat(2,1fr); }
    .wit-article-layout { flex-direction:column; }
    .wit-article-sidebar { width:100%; position:static; }
    .wit-cat-grid-posts { grid-template-columns:1fr; }
    .wit-topics-columns { flex-direction:column; gap:0; }
    /* Mobile ads */
    .wit-ad-desktop { display:none; }
    .wit-ad-mobile  { display:block; }
}
@media (max-width:480px) {
    .wit-cards-grid { grid-template-columns:1fr; }
    .wit-cat-grid { grid-template-columns:1fr; }
    .wit-popular-topic-card { width:100%; }
}

/* ── Login Modal (for non-logged-in comment/reply attempts) ─── */
.wc-modal-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9200; align-items:center; justify-content:center; padding:16px; }
.wc-modal-backdrop.open { display:flex !important; }
.wc-modal { background:#fff; width:100%; max-width:480px; box-shadow:0 20px 60px rgba(0,0,0,.25); display:flex; flex-direction:column; max-height:92vh; overflow:hidden; }
.wc-modal-head { display:flex; align-items:center; justify-content:space-between; padding:18px 22px 14px; border-bottom:1px solid #f0f0f0; font-size:16px; font-weight:700; color:#1a1a2e; flex-shrink:0; }
.wc-modal-login .wc-modal-head { background:#FFD700 !important; border-bottom:none !important; padding:16px 22px !important; border-radius:0; }
.wc-modal-login .wc-modal-head span { font-size:18px; font-weight:500; color:#1a1a2e !important; }
.wc-modal-x { background:none; border:none; color:#9ca3af; font-size:18px; cursor:pointer; padding:2px 6px; border-radius:6px; transition:color .18s; }
.wc-modal-login .wc-modal-x { color:#1a1a2e !important; font-size:20px; }
.wc-modal-x:hover { color:#ef4444; }
.wc-modal-body { padding:20px 22px; overflow-y:auto; flex:1; }
.wc-modal-login .wc-modal-body { padding:16px !important; }
.wc-login-desc { text-align:center; font-size:14px; color:#4b5563; margin:0 0 28px; line-height:1.6; }
.wc-login-options { display:flex !important; gap:20px; justify-content:center; }
.wc-login-option { display:flex !important; flex-direction:column; align-items:center; gap:10px; flex:1; }
a.wc-btn-login-outline { display:block !important; width:100%; text-align:center; background:#FFD700 !important; color:#212529 !important; border:2px solid #FFD700 !important; border-radius:0; padding:10px 17px; font-size:15px; font-weight:700 !important; cursor:pointer; text-decoration:none !important; transition:background .18s,color .18s; box-sizing:border-box; }
a.wc-btn-login-outline:hover { background:#FFD700 !important; color:#1a1a2e !important; text-decoration:none !important; }
a.wc-btn-login-primary { display:block !important; width:100%; text-align:center; background:#FFD700 !important; color:#212529 !important; border:2px solid #FFD700 !important; border-radius:0; padding:10px 17px; font-size:15px; font-weight:700 !important; cursor:pointer; text-decoration:none !important; transition:background .18s; box-sizing:border-box; }
a.wc-btn-login-primary:hover { background:#FFD700 !important; border-color:#FFD700 !important; text-decoration:none !important; }
a.wc-login-sub-link { font-size:14px !important; color:#007bff !important; text-decoration:none !important; font-weight:400; }
a.wc-login-sub-link:hover { text-decoration:underline !important; }

/* ── Community Guest Modal ─────────────────────────────────────── */
.wit-cg-modal-box { max-width:520px !important; }
.wit-cg-head { background:#FFD700 !important; border-bottom:none !important; padding:16px 22px !important; }
.wit-cg-head span { font-size:16px; font-weight:600; color:#1a1a2e !important; }
.wit-cg-head .wc-modal-x { color:#1a1a2e !important; font-size:20px; }
.wit-cg-body { padding:20px 22px !important; }
.wit-cg-section-title { font-size:1.75rem; font-weight:700; color:#1a1a2e; margin:0 0 14px; text-align:center; }
.wit-cg-section { margin-bottom:8px; }
.wit-cg-field { margin-bottom:12px; }
.wit-cg-field label { display:block; font-size:13px; font-weight:600; color:#374151; margin-bottom:5px; }
.wit-cg-input { width:100%; border:1px solid #d1d5db; border-radius:6px; padding:9px 12px; font-size:14px; color:#374151; font-family:inherit; box-sizing:border-box; transition:border-color .18s; }
.wit-cg-input:focus { outline:none; border-color:#FFD700; }
.wit-cg-terms label { display:flex; align-items:flex-start; gap:8px; font-weight:400; cursor:pointer; }
.wit-cg-terms input[type="checkbox"] { margin-top:2px; flex-shrink:0; }
.wit-cg-submit-btn { width:100%; max-width:200px; }
button.wc-btn-login-primary { display:inline-block; background:#FFD700 !important; color:#212529 !important; border:2px solid #FFD700 !important; border-radius:0; padding:10px 17px; font-size:15px; font-weight:700 !important; cursor:pointer; text-decoration:none !important; transition:background .18s; box-sizing:border-box; }
button.wc-btn-login-primary:hover { background:#FFD700 !important; border-color:#FFD700 !important; }
button.wc-btn-login-primary:disabled { opacity:.65; cursor:not-allowed; }
.wit-cg-divider { border:none; border-top:1px solid #e5e7eb; margin:20px 0; }
.wit-cg-login-row { display:flex; gap:16px; }
.wit-cg-login-row .wit-cg-field { flex:1; margin-bottom:0; }
