/*
Theme Name: Pakistan Connect
Theme URI: https://pakistanconnect.local
Author: Pakistan Connect
Author URI: https://pakistanconnect.local
Description: A modern news portal WordPress theme designed for Pakistan Connect — built with Tailwind CSS, fully responsive, supports top stories, reels, sports, business, lifestyle, technology sections, custom post types, breaking news ticker, and a chat widget.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
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: pakistan-connect
Tags: news, blog, magazine, grid-layout, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, responsive-layout
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
html, body { font-family: 'Inter', system-ui, -apple-system, sans-serif; overflow-x: hidden; }
body { background:#fff; color:#111827; }
.custom-logo-link img { display: block; }
.custom-logo-link { display: flex; }

:root {
  --brand-green:    #0f6e2c;
  --brand-greenDark:#0a5421;
  --brand-greenLight:#15a14a;
  --brand-yellow:   #facc15;
  --brand-red:      #dc2626;
  --navy:           #1E381A;
  --ticker-bg:      #C72D18;
  --text:           #356027;
  --border:         #CECECE;
}

/* ---------- Marquee ---------- */
@keyframes marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.ticker-track { animation: marquee 40s linear infinite; }
.ticker-track:hover { animation-play-state: paused; }

/* ---------- Reels horizontal scroll ---------- */
.reels-scroll { scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.reels-scroll > * { scroll-snap-align: start; }
.reels-scroll::-webkit-scrollbar { display: none; }

/* ---------- Section heading with green bar ---------- */
.section-title {
  position: relative;
  padding-left: 1rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}
@media (min-width: 640px) { .section-title { font-size: 1.5rem; } }
.section-title::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 22px;
  background: var(--brand-green);
  border-radius: 2px;
}

/* ---------- Live dot pulse ---------- */
@keyframes livePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .5; transform: scale(1.4); }
}
.live-dot { animation: livePulse 1.4s ease-in-out infinite; }

/* ---------- Chat bubble ---------- */
.chat-bubble { animation: chatPop .25s ease-out; }
@keyframes chatPop {
  from { opacity: 0; transform: translateY(8px) scale(.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---------- WordPress required classes ---------- */
.alignleft   { float:left;  margin-right:1.5em; }
.alignright  { float:right; margin-left:1.5em; }
.aligncenter { display:block; margin:0 auto 1.5em; }
.alignwide   { max-width:1280px; margin-left:auto; margin-right:auto; }
.alignfull   { max-width:100%; width:100%; }

.wp-caption { margin-bottom:1.5em; max-width:100%; }
.wp-caption-text { font-size:.85em; color:#6b7280; text-align:center; padding-top:.5em; }
.gallery-caption { font-size:.85em; color:#6b7280; }

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}
.pc-news-tag {
	clip-path: polygon(0 0, 82% 0, 100% 50%, 82% 100%, 0 100%);
}
/* ---------- Sticky header ---------- */
.site-header { position: sticky; top: 0; z-index: 40; width:100%; overflow-x:hidden; box-sizing:border-box; }
.site-header > * { box-sizing:border-box; }

/* ---------- Post list (used in archives / search) ---------- */
.post-card-title a:hover { color: var(--brand-green); }
.post-card-thumb { overflow:hidden; border-radius:.5rem; }
.post-card-thumb img { transition: transform .5s; }
.post-card-thumb:hover img { transform: scale(1.05); }

/* ---------- Pagination ---------- */
.pagination { display:flex; gap:.5rem; justify-content:center; margin:2rem 0; }
.pagination .page-numbers {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2.25rem; height:2.25rem; padding:0 .6rem;
  border:1px solid #e5e7eb; border-radius:.375rem;
  color:#111827; font-size:.875rem; font-weight:500;
}
.pagination .page-numbers.current { background: var(--brand-green); color:#fff; border-color: var(--brand-green); }
.pagination .page-numbers:hover:not(.current) { background:#f3f4f6; }

/* ---------- Comment form polish ---------- */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width:100%; padding:.6rem .8rem; border:1px solid #e5e7eb; border-radius:.375rem;
  font-size:.875rem;
}
.comment-form label { display:block; font-size:.875rem; font-weight:600; margin-bottom:.25rem; }
.comment-form .submit {
  background: var(--brand-green); color:#fff; border:none;
  padding:.6rem 1.2rem; border-radius:.375rem; cursor:pointer; font-weight:600;
}
.comment-form .submit:hover { background: var(--brand-greenDark); }