/*
Theme Name:   Punjab Lottery Child
Template:     generatepress
Description:  Punjab State Lottery Results - halki child theme, GeneratePress ke upar.
Version:      1.0.22
Author:       Punjab State Lottery Results
*/

:root{
	--pl-blue:#1565C0;
	--pl-blue-light:#EEF4FC;
	--pl-blue-lighter:#E6F1FB;
	--pl-gold:#D4A017;
	--pl-gold-light:#FFC107;
	--pl-menu-bg:#C9A227;
	--pl-text-on-blue:#FFFFFF;
	--pl-text-muted-on-blue:#D8E9FB;
	--pl-menu-text:#0D1B4C;
}

/* ---------- Reset a few GeneratePress defaults we don't need ---------- */
.site-header,
.inside-header,
#site-navigation,
.main-navigation{
	background:transparent;
	box-shadow:none;
}
html{
	overflow-x:hidden;
}
body{
	background:#ffffff;
	overflow-x:hidden;
	max-width:100vw;
}

/* ---------- Poore site mein ek hi font -- title, menu, headings, tables ----------
   Ye system fonts hain (koi file download nahi hoti), isliye speed pe
   ZERO asar -- phone/computer mein pehle se installed fonts use hote hain. */
body, h1, h2, h3, h4, h5, h6, table, th, td, button, input, textarea{
	font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Plugin ke Draw Details / Prize Details jaisi tables ka design behtar */
/* Plugin content ke andar ke headings (Draw Details, Prize Details,
   Winning Lottery Numbers) -- default bahut bade aate hain, chhota kiya.
   Font wahi system-font hai jo title/menu mein hai. */
.pl-single-content h1,
.pl-single-content h2{
	font-size:20px !important;
}
.pl-single-content h3{
	font-size:17px !important;
}

.pl-single-content table{
	width:100%;
	border-collapse:collapse;
	margin:0 0 16px;
	font-size:14px;
}
.pl-single-content table th,
.pl-single-content table td{
	border:1px solid #dde3ea;
	padding:9px 10px;
	text-align:left;
}
.pl-single-content table th{
	background:var(--pl-blue-light);
	color:var(--pl-blue);
	font-weight:700;
}
.pl-single-content table tr:nth-child(even) td{
	background:#f7f9fc;
}

/* ============ HEADER ============ */
.pl-header{
	background:var(--pl-blue);
	padding:16px 16px 12px;
	display:flex;
	align-items:center;
	gap:12px;
}
.pl-header a.pl-logo-link{
	display:flex;
	align-items:center;
	gap:10px;
	text-decoration:none;
}
.pl-logo-circle{
	width:42px;
	height:42px;
	border-radius:50%;
	background:#ffffff;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	position:relative;
	overflow:visible;
}
.pl-logo-circle img{
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-50%);
	width:50px;
	max-width:none;
	height:auto;
	display:block;
}
.pl-logo-circle svg{
	width:22px;
	height:22px;
	fill:var(--pl-blue);
}
.pl-site-title{
	color:var(--pl-text-on-blue) !important;
	font-size:17px;
	font-weight:600;
	line-height:1.25;
	margin:0;
}
.pl-header-search{
	margin-left:auto;
	display:flex;
	align-items:center;
}
.pl-search-toggle{
	background:none;
	border:none;
	cursor:pointer;
	padding:8px;
	color:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
}
.pl-search-toggle svg{
	width:20px;
	height:20px;
	stroke:#fff;
	fill:none;
	stroke-width:2;
}
.pl-header-search-box{
	display:none;
	background:var(--pl-blue);
	padding:0 16px 12px;
}
.pl-header-search-box.pl-open{
	display:block;
}
.pl-header-search-box form{
	display:flex;
}
.pl-header-search-box input[type="search"]{
	flex:1;
	border:none;
	border-radius:6px 0 0 6px;
	padding:9px 12px;
	font-size:14px;
}
.pl-header-search-box button{
	border:none;
	background:var(--pl-gold);
	color:var(--pl-blue);
	padding:0 14px;
	border-radius:0 6px 6px 0;
	cursor:pointer;
	font-weight:600;
}

/* ============ MENU BAR ============ */
.pl-menu-bar{
	background:var(--pl-menu-bg);
}
.pl-menu-bar ul{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	gap:0;
}
.pl-menu-bar li{
	margin:0;
}
.pl-menu-bar a{
	display:block;
	padding:12px 18px;
	color:var(--pl-menu-text); /* gold background par white text sirf 2.4:1 tha -- accessibility audit fail; dark navy se 6.7:1+ */
	font-weight:600;
	font-size:15px;
	text-decoration:none;
}
.pl-menu-bar a:hover{
	opacity:0.8;
}

/* ============ PAGE HEADING (Latest Lottery Results / category / search) ============ */
.pl-section-heading{
	background:var(--pl-blue);
	color:#fff;
	font-size:19px;
	font-weight:700;
	padding:10px 16px;
	margin:20px 16px 14px;
	position:relative;
}
.pl-section-heading::after{
	content:"";
	position:absolute;
	left:16px;
	right:16px;
	bottom:-4px;
	height:2px;
	background:var(--pl-blue);
}
.pl-search-result-note{
	margin:0 16px 14px;
	font-size:14px;
	color:#555;
}

/* ============ CALENDAR / DATE PICKER ============ */
.pl-date-picker-wrap{
	margin:0 16px 20px;
	background:var(--pl-blue);
	border-radius:12px;
	padding:14px;
}
.pl-date-picker-label{
	font-size:13px;
	font-weight:600;
	color:#fff;
	margin:0 0 8px;
}
.pl-date-picker-trigger{
	background:rgba(255,255,255,.12);
	border-radius:8px;
	padding:10px 14px;
	display:flex;
	align-items:center;
	gap:8px;
	color:#fff;
	font-size:14px;
	font-weight:600;
	border:none;
	width:100%;
	cursor:pointer;
}
.pl-date-picker-trigger input[type="date"]{
	border:none;
	background:transparent;
	font-size:14px;
	font-weight:600;
	color:#fff;
	font-family:inherit;
	flex:1;
}
.pl-date-picker-trigger input[type="date"]::-webkit-calendar-picker-indicator{
	filter:invert(1);
}
.pl-date-picker-trigger svg{
	width:18px;
	height:18px;
	stroke:#fff;
	fill:none;
	stroke-width:2;
	flex-shrink:0;
}

/* ============ POST GRID (home / category / search / related) ============ */
.pl-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	column-gap:16px;
	row-gap:26px;
	margin:0 16px 20px;
}
.pl-card{
	background:var(--pl-blue);
	border-radius:8px;
	padding:2px;
	overflow:hidden;
	text-decoration:none;
	display:flex;
	flex-direction:column;
}
.pl-card-img-box{
	background:var(--pl-blue-lighter) !important;
	border-radius:6px !important;
	width:100% !important;
	height:165px !important;
	max-height:165px !important;
	overflow:hidden !important;
	margin-bottom:0 !important;
	flex-shrink:0;
	box-sizing:border-box;
}
.pl-card-img-box img{
	width:100% !important;
	min-width:100% !important;
	max-width:100% !important;
	height:100% !important;
	max-height:165px !important;
	object-fit:cover !important;
	object-position:top center !important;
	display:block !important;
}
.pl-card-img-box.pl-no-image{
	display:flex;
	align-items:center;
	justify-content:center;
}
.pl-card-title{
	color:#fff;
	font-size:15px;
	font-weight:600;
	line-height:1.32;
	margin:0;
	padding:11px 8px 13px;
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	overflow:hidden;
	min-height:2.6em;
}

/* ============ PAGINATION ============ */
.pl-pagination{
	display:flex;
	justify-content:center;
	flex-wrap:nowrap;
	overflow-x:auto;
	gap:6px;
	margin:20px 16px 28px;
	padding-bottom:4px;
	-webkit-overflow-scrolling:touch;
}
.pl-pagination a:first-child,
.pl-pagination a:last-child{
	position:sticky;
	background:#fff;
	z-index:1;
}
.pl-pagination a:first-child{
	left:0;
}
.pl-pagination a:last-child{
	right:0;
}
.pl-pagination a,
.pl-pagination span.pl-page-current,
.pl-pagination span.pl-page-dots{
	min-width:34px;
	flex-shrink:0;
	height:38px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:8px;
	border:1.5px solid var(--pl-blue);
	color:var(--pl-blue);
	text-decoration:none;
	font-size:14px;
	font-weight:600;
	padding:0 6px;
}
.pl-pagination span.pl-page-current{
	background:var(--pl-blue);
	color:#fff;
}
.pl-pagination span.pl-page-dots{
	border:none;
	color:#888;
}

/* ============ SINGLE POST EXTRAS ============ */
.pl-breadcrumbs{
	margin:14px 16px 6px;
	font-size:12.5px;
	color:#777;
}
.pl-breadcrumbs a{
	color:#777;
	text-decoration:none;
}
.pl-single-category{
	display:inline-block;
	margin:14px 16px 0;
	background:var(--pl-blue);
	color:#fff !important;
	font-size:12.5px;
	font-weight:600;
	padding:5px 12px;
	border-radius:6px;
	text-decoration:none;
}
.pl-single-title{
	background:var(--pl-blue);
	color:#fff;
	margin:10px 16px 14px;
	font-size:19px;
	line-height:1.3;
	font-weight:700;
	padding:10px 16px;
	position:relative;
}
.pl-single-title::after{
	content:"";
	position:absolute;
	left:16px;
	right:16px;
	bottom:-4px;
	height:2px;
	background:var(--pl-blue);
}
.pl-single-content{
	padding:0 16px;
	box-sizing:border-box;
	overflow-x:hidden;
	max-width:100%;
	word-wrap:break-word;
	overflow-wrap:break-word;
}
.pl-single-content table{
	table-layout:auto;
	max-width:100%;
}
.pl-single-content img{
	max-width:100%;
	height:auto;
}
.pl-single-meta{
	margin:0 16px 10px;
	font-size:13px;
	color:#777;
}
.pl-share-bar{
	margin:24px 16px;
	padding:16px 0;
	border-top:1px solid #e5e5e5;
	border-bottom:1px solid #e5e5e5;
	display:flex;
	align-items:center;
	gap:10px;
}
.pl-share-label{
	font-size:14px;
	font-weight:600;
	color:#333;
	margin-right:4px;
}
.pl-share-btn{
	display:flex;
	align-items:center;
	justify-content:center;
	width:40px;
	height:40px;
	border-radius:50%;
	text-decoration:none;
	color:#fff;
}
.pl-share-btn.pl-whatsapp{ background:#25D366; }
.pl-share-btn.pl-facebook{ background:#1877F2; }
.pl-share-btn svg{
	width:20px;
	height:20px;
	fill:#fff;
}

.pl-related-heading{
	background:var(--pl-blue);
	color:#fff;
	font-size:19px;
	font-weight:700;
	padding:10px 16px;
	margin:28px 16px 14px;
	position:relative;
	text-align:center;
}
.pl-related-heading::after{
	content:"";
	position:absolute;
	left:16px;
	right:16px;
	bottom:-4px;
	height:2px;
	background:var(--pl-blue);
}

/* ============ FOOTER ============ */
.pl-footer{
	background:var(--pl-blue);
	padding:22px 16px;
	text-align:center;
	margin-top:32px;
}
.pl-footer-title{
	color:#fff;
	font-size:17px;
	font-weight:700;
	margin:0 0 14px;
}
.pl-footer-links{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:16px;
	margin-bottom:14px;
}
.pl-footer-links a{
	color:var(--pl-text-muted-on-blue);
	font-size:13px;
	text-decoration:none;
}
.pl-footer-links a:hover{
	text-decoration:underline;
}
.pl-footer-copy{
	color:var(--pl-text-muted-on-blue); /* pehle #85B7EB tha, blue background par sirf 2.7:1 -- audit fail */
	font-size:12px;
}

/* ============ 404 PAGE ============ */
.pl-404{
	text-align:center;
	padding:60px 20px;
}
.pl-404 h1{
	font-size:26px;
	color:var(--pl-blue);
	margin-bottom:10px;
}
.pl-404 p{
	color:#666;
	margin-bottom:24px;
}
.pl-404-btn{
	display:inline-block;
	background:var(--pl-blue);
	color:#fff !important;
	padding:12px 28px;
	border-radius:8px;
	text-decoration:none;
	font-weight:600;
}

/* ============ CONTACT PAGE ============ */
.pl-contact-wrap{
	margin:20px 16px;
}
.pl-contact-wrap label{
	display:block;
	font-size:13px;
	font-weight:600;
	color:#333;
	margin:14px 0 6px;
}
.pl-contact-wrap input[type="text"],
.pl-contact-wrap input[type="email"],
.pl-contact-wrap textarea{
	width:100%;
	border:1px solid #ccc;
	border-radius:6px;
	padding:10px 12px;
	font-size:14px;
	box-sizing:border-box;
	font-family:inherit;
}
.pl-contact-actions{
	display:flex;
	align-items:center;
	gap:10px;
	margin-top:16px;
}
.pl-contact-wrap button[type="submit"]{
	flex:1;
	background:var(--pl-blue);
	color:#fff;
	border:none;
	padding:12px 16px;
	border-radius:8px;
	font-weight:600;
	font-size:15px;
	cursor:pointer;
}
.pl-contact-whatsapp{
	flex:1;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	background:#25D366;
	color:#fff !important;
	padding:12px 16px;
	border-radius:8px;
	text-decoration:none;
	font-weight:600;
	font-size:14px;
}
.pl-contact-whatsapp svg{
	width:18px;
	height:18px;
	fill:#fff;
	flex-shrink:0;
}
.pl-form-msg{
	margin:14px 0;
	padding:10px 14px;
	border-radius:6px;
	font-size:14px;
}
.pl-form-msg.success{
	background:#e6f7ee;
	color:#0a7a3f;
}
.pl-form-msg.error{
	background:#fdeaea;
	color:#a32d2d;
}

/* ============ COMMENTS ============ */
.pl-comments-wrap{
	margin:24px 16px;
}
.pl-comments-heading{
	font-size:18px;
	font-weight:700;
	color:var(--pl-blue);
	margin:0 0 14px;
}
.pl-comment-list{
	list-style:none;
	margin:0 0 18px;
	padding:0;
}
.pl-comment-row{
	background:#fff !important;
	border:1px solid #e3e8ef !important;
	border-radius:10px !important;
	padding:14px 16px !important;
	margin-bottom:16px !important;
	box-shadow:0 1px 3px rgba(13,27,76,0.06) !important;
}
.pl-comment-row:nth-child(even){
	background:#f8fafc !important;
}
/* Reply thread -- parent comment ke ANDAR hi rehta hai. Ab har taraf
   (upar/neeche/dayen bhi) thoda saans lene ki jagah di hai, aur alag-alag
   replies ke beech mein bhi gap hai -- pehle sirf left-indent tha, baaki
   teeno taraf bilkul chipka hua tha. !important -- GeneratePress (parent
   theme) ki apni comment-list CSS kabhi-kabhi zyada specific nikal jaati
   hai aur hamari overrides ko dabaa deti hai, isliye pakka kar diya. */
.pl-comment-list .children{
	list-style:none !important;
	margin:16px 0 0 !important;
	padding:16px 0 0 !important;
	border-top:1px dashed #d7dee7 !important;
}
.pl-comment-list .children .pl-comment-row{
	background:transparent !important;
	border:none !important;
	box-shadow:none !important;
	padding:0 14px 0 15% !important;
	margin:0 0 18px !important;
}
.pl-comment-list .children .pl-comment-row:last-child{
	margin-bottom:0 !important;
}
.pl-comment-list .children .pl-comment-author::before{
	content:"↳ ";
	color:var(--pl-gold, #D4A017);
	font-weight:800;
}
.pl-comment-author{
	font-weight:700;
	font-size:14px;
	color:#222;
	margin:0 0 4px;
}
.pl-comment-text p{
	font-size:14px;
	color:#444;
	margin:0;
}
.pl-comment-reply-link{
	display:inline-block;
	margin-top:6px;
	font-size:14px;
	font-weight:600;
	color:var(--pl-blue);
	text-decoration:none;
}
.pl-comments-pagination{
	margin-bottom:18px;
	font-size:13px;
	display:flex;
	align-items:center;
	flex-wrap:nowrap;
	overflow-x:auto;
	gap:8px;
	-webkit-overflow-scrolling:touch;
}
.pl-comments-pagination a,
.pl-comments-pagination span{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:34px;
	flex-shrink:0;
	height:34px;
	padding:0 10px;
	border-radius:8px;
	border:1.5px solid var(--pl-blue);
	color:var(--pl-blue);
	text-decoration:none;
	font-weight:600;
	font-size:13px;
}
.pl-comments-pagination span.current{
	background:var(--pl-blue);
	color:#fff;
}
#respond .comment-form-url{
	display:none !important;
}
#respond input[type="text"],
#respond input[type="email"],
#respond textarea{
	width:100%;
	border:1px solid #ccc;
	border-radius:6px;
	padding:10px 12px;
	font-size:14px;
	box-sizing:border-box;
	font-family:inherit;
	margin-bottom:10px;
}
#respond label{
	display:block;
	font-size:13px;
	font-weight:600;
	color:#333;
	margin-bottom:4px;
}
#respond .pl-comment-submit{
	background:var(--pl-blue);
	color:#fff;
	border:none;
	padding:11px 24px;
	border-radius:8px;
	font-weight:600;
	font-size:14px;
	cursor:pointer;
}
#respond #reply-title{
	font-size:16px;
	color:var(--pl-blue);
	margin-bottom:10px;
}

@media (min-width:700px){
	.pl-grid{
		grid-template-columns:repeat(4,1fr);
	}
}

/* ============ GO TO TOP ============ */
#pl-back-to-top{
	position:fixed;
	right:16px;
	bottom:68px;
	width:44px;
	height:44px;
	border-radius:50%;
	background:var(--pl-gold-light);
	border:none;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 2px 8px rgba(0,0,0,.25);
	cursor:pointer;
	opacity:0;
	visibility:hidden;
	transform:translateY(10px);
	transition:opacity .2s, transform .2s, visibility .2s;
	z-index:999;
	color:var(--pl-blue);
	font-size:22px;
	line-height:1;
	font-weight:700;
	padding:0;
}
#pl-back-to-top.pl-show{
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

/* ============ WhatsApp floating channel button (bottom-right, every page) ============
   Pehle ek separate plugin tha ("WhatsApp Floating Channel Button"), ab
   theme mein hi built-in hai -- functions.php mein pl_whatsapp_floating_button().
   Background WhatsApp ka asli bright green (#25D366) hai -- lekin white text
   iske saath sirf ~2:1 contrast deta (accessibility audit fail), isliye text/
   icon ka color WhatsApp ka hi dark teal (#054D34) rakha hai -- ~5:1 contrast,
   pass hota hai, aur dono colors WhatsApp ki apni brand palette se hain. */
.pl-whatsapp-floating{
	position:fixed;
	bottom:20px;
	right:15px;
	background:#25D366;
	color:#054D34;
	padding:12px 16px;
	border-radius:30px;
	display:flex;
	align-items:center;
	gap:8px;
	font-size:14px;
	font-weight:600;
	text-decoration:none;
	box-shadow:0 4px 10px rgba(0,0,0,.2);
	z-index:999;
	transition:opacity .3s ease;
	-webkit-tap-highlight-color:transparent; /* mobile tap ka default gray/blue flash hatata hai */
}
/* Sirf mouse/desktop pe hi hover-opacity lagao -- touch devices par tap
   karne ke baad :hover style "chipak" jaati hai (koi real mouse-leave event
   nahi hota), jisse button tap ke baad half-transparent dikhta rehta tha. */
@media (hover:hover) and (pointer:fine){
	.pl-whatsapp-floating:hover{
		opacity:.9;
	}
}
.pl-whatsapp-floating-icon{
	width:20px;
	height:20px;
	flex-shrink:0;
}
.pl-whatsapp-floating-icon path{
	fill:#054D34;
}
@media (max-width:768px){
	.pl-whatsapp-floating{
		bottom:15px;
		right:10px;
		padding:10px 14px;
		font-size:13px;
	}
}
