/*
Theme Name: Tahmeel PC Games
Theme URI: https://tahmeelpcgames.com
Author: Muhammad Ali
Description: قالب ووردبريس مخصص لمواقع تحميل ألعاب الكمبيوتر باللغة العربية، تصميم مجلة يعرض التصنيفات في الشريط الجانبي وقائمة مقالات مع صور مصغرة.
Version: 2.0
Requires PHP: 7.4
Text Domain: tahmeelpcgames
*/

:root{
  --header-bg:#12141b;
  --brand:#178a6e;
  --brand-dark:#106350;
  --brand-light:#1fa683;
  --bg:#f2f3f5;
  --card-bg:#ffffff;
  --line:#e3e5ea;
  --text:#1b1d22;
  --text-muted:#6b6f7a;
  --radius:8px;
}

*{box-sizing:border-box;}
html{direction:rtl;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Tajawal','IBM Plex Sans Arabic',sans-serif;
  line-height:1.7;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 20px;}

/* ===== TOP BAR ===== */
.site-header{background:var(--header-bg); color:#fff;}
.branding{
  display:flex; flex-direction:column; align-items:center;
  padding:26px 20px 18px;
}
.branding .logo-row{display:flex; align-items:center; gap:12px;}
.branding .logo-icon{
  width:46px; height:46px; border-radius:10px;
  background:linear-gradient(135deg,var(--brand-light),var(--brand-dark));
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:20px; color:#fff;
}
.branding h1{font-size:30px; margin:0; font-weight:800; letter-spacing:-.5px;}
.branding h1 span{color:var(--brand-light);}
.branding small{
  display:block; margin-top:4px; font-size:13px; color:#9ba0ad;
  direction:ltr; letter-spacing:.5px; font-family:'IBM Plex Mono',monospace;
}

.toolbar{
  background:#181a22; border-top:1px solid #262933;
  padding:14px 20px;
}
.toolbar .wrap{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.search-form{
  flex:1; min-width:220px; display:flex; background:#fff; border-radius:6px; overflow:hidden;
}
.search-form input[type="search"]{
  flex:1; border:0; padding:12px 16px; font-family:inherit; font-size:14px; outline:none;
}
.search-form button{
  background:var(--brand); border:0; color:#fff; padding:0 18px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.quicklinks{display:flex; gap:8px; flex-wrap:wrap;}
.quicklinks a{
  background:var(--brand-dark); color:#fff; padding:11px 16px; border-radius:6px;
  font-size:13.5px; font-weight:600; display:flex; align-items:center; gap:6px;
  transition:background .2s;
  white-space:nowrap;
}
.quicklinks a:hover{background:var(--brand);}

/* ===== MAIN LAYOUT ===== */
.site-main{padding:32px 0 64px;}
.layout{display:grid; grid-template-columns:270px 1fr; gap:26px; align-items:start;}

/* Sidebar position — controlled from Customizer (Appearance > Customize > إعدادات القالب) */
.sidebar{order:1;}
.content{order:2;}
body.sidebar-left .layout{grid-template-columns:1fr 270px;}
body.sidebar-left .sidebar{order:2;}
body.sidebar-left .content{order:1;}

/* Featured image toggle */
body.hide-featured-image .post-thumb{display:none;}
body.hide-featured-image .post-card .post-body{display:block;}
body.hide-featured-image .single-post .post-thumb-full{display:none;}

/* Post meta toggles */
body.hide-post-date .post-meta .meta-date{display:none;}
body.hide-post-category .post-meta .meta-cat{display:none;}

/* ===== SIDEBAR ===== */
.widget{
  background:var(--card-bg); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px; margin-bottom:20px;
}
.widget-title{
  font-size:16px; font-weight:800; margin:0 0 16px; padding-bottom:12px;
  border-bottom:2px solid var(--brand); display:flex; align-items:center; gap:8px;
}
.cat-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.cat-grid a{
  background:var(--header-bg); color:#fff; padding:11px 10px; border-radius:6px;
  font-size:13px; font-weight:600; text-align:center;
  display:flex; align-items:center; justify-content:center; gap:6px;
  transition:background .2s;
}
.cat-grid a:hover{background:var(--brand);}
.promo-box{border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);}
.promo-box img{width:100%;}
.promo-box .cap{padding:12px; font-size:13px; font-weight:600; background:var(--card-bg);}

/* ===== POST LIST ===== */
.post-list{display:flex; flex-direction:column; gap:18px;}
.post-card{
  background:var(--card-bg); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px; transition:border-color .2s, box-shadow .2s;
}
.post-card:hover{border-color:var(--brand); box-shadow:0 4px 18px -8px rgba(0,0,0,.12);}
.post-card h2{font-size:19px; margin:0 0 12px; font-weight:800; line-height:1.4;}
.post-card h2 a:hover{color:var(--brand);}
.post-card .post-body{display:flex; gap:18px;}
.post-card .post-text{flex:1;}
.post-card .post-text p{margin:0; color:var(--text-muted); font-size:14.5px;}
.post-thumb{
  width:180px; min-width:180px; height:112px; border-radius:6px; overflow:hidden;
  border:1px solid var(--line); position:relative;
}
.post-thumb img{width:100%; height:100%; object-fit:cover;}
.post-thumb .no-img{
  width:100%; height:100%; background:linear-gradient(135deg,var(--brand-dark),var(--header-bg));
  display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:13px;
}
.post-meta{
  display:flex; gap:14px; margin-top:12px; font-size:12px; color:var(--text-muted);
  font-family:'IBM Plex Mono',monospace; direction:ltr; justify-content:flex-end;
}

/* pagination */
.pagination{display:flex; gap:8px; justify-content:center; margin-top:30px;}
.pagination a, .pagination span{
  background:var(--card-bg); border:1px solid var(--line); padding:9px 15px; border-radius:6px; font-size:13px; font-weight:600;
}
.pagination .current{background:var(--brand); color:#fff; border-color:var(--brand);}

/* single post */
.single-post{background:var(--card-bg); border:1px solid var(--line); border-radius:var(--radius); padding:28px;}
.single-post h1{font-size:26px; margin:0 0 16px;}
.single-post .post-thumb-full{width:100%; height:auto; border-radius:8px; margin-bottom:20px; overflow:hidden; border:1px solid var(--line);}
.single-post .entry-content{font-size:15.5px; color:#2a2c33;}
.single-post .entry-content h2, .single-post .entry-content h3{margin-top:26px;}
.dl-button{
  display:inline-flex; align-items:center; gap:10px; background:var(--brand); color:#fff;
  padding:14px 26px; border-radius:8px; font-weight:800; margin:18px 0; font-size:15px;
  transition:background .2s;
}
.dl-button:hover{background:var(--brand-dark);}

/* footer */
.site-footer{background:var(--header-bg); color:#9ba0ad; padding:36px 0; margin-top:40px; font-size:13.5px;}
.site-footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px;}
.site-footer a{color:#c7cad2;}
.site-footer a:hover{color:var(--brand-light);}

/* header sticky */
body.header-sticky .site-header{position:sticky; top:0; z-index:50; transition:box-shadow .2s;}
body.header-sticky .site-header.is-scrolled{box-shadow:0 4px 16px rgba(0,0,0,.25);}

/* no sidebar on single post (Customizer toggle) */
body.no-sidebar-single.single .layout{grid-template-columns:1fr;}
body.no-sidebar-single.single .sidebar{display:none;}
body.no-sidebar-single.single .single-post,
body.no-sidebar-single.single .tpg-related{max-width:820px; margin-left:auto; margin-right:auto;}

/* ===== breadcrumbs ===== */
.tpg-breadcrumbs{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--text-muted); margin-bottom:16px;}
.tpg-breadcrumbs a:hover{color:var(--brand);}
.tpg-breadcrumbs .current{color:var(--text); font-weight:600;}

/* ===== shared box title ===== */
.tpg-box-title{
  font-size:18px; font-weight:800; margin:26px 0 14px; padding-bottom:10px;
  border-bottom:2px solid var(--brand);
}
.single-post > .tpg-box-title:first-of-type,
.single-post > .tpg-info-box:first-child .tpg-box-title{margin-top:0;}

/* ===== GAME INFO BOX (icon grid) ===== */
.tpg-info-box{background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); padding:18px; margin-bottom:6px;}
.tpg-info-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
.tpg-info-item{
  background:var(--card-bg); border:1px solid var(--line); border-radius:8px;
  padding:16px 10px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px;
}
.tpg-info-icon{width:26px; height:26px; color:var(--brand);}
.tpg-info-icon svg{width:100%; height:100%;}
.tpg-info-label{font-size:12px; color:var(--text-muted); font-weight:600;}
.tpg-info-value{font-size:14px; font-weight:800; word-break:break-word;}

/* ===== REQUIREMENTS TABLE ===== */
.tpg-requirements{margin-bottom:6px;}
.tpg-req-table{width:100%; border-collapse:collapse; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;}
.tpg-req-table tr{border-bottom:1px solid var(--line);}
.tpg-req-table tr:last-child{border-bottom:0;}
.tpg-req-table td{padding:13px 16px; font-size:14px;}
.tpg-req-table td.tpg-req-label{
  background:var(--header-bg); color:#fff; font-weight:700; width:38%; text-align:center;
}
.tpg-req-table td.tpg-req-value{color:var(--text); text-align:center; background:var(--card-bg);}

/* ===== SCREENSHOTS ===== */
.tpg-screenshots{margin-bottom:6px;}
.tpg-screenshots-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.tpg-shot-link{display:block; border-radius:8px; overflow:hidden; border:1px solid var(--line); aspect-ratio:16/9;}
.tpg-shot-link img{width:100%; height:100%; object-fit:cover; transition:transform .3s;}
.tpg-shot-link:hover img{transform:scale(1.05);}

/* ===== DOWNLOAD BOX ===== */
.tpg-download-box{
  text-align:center; background:var(--bg); border:1px dashed var(--brand);
  border-radius:var(--radius); padding:26px 18px; margin:24px 0;
}
.dl-button{
  display:inline-flex; align-items:center; gap:12px; background:var(--brand); color:#fff;
  padding:16px 30px; border-radius:var(--radius); font-weight:800; font-size:16px;
  transition:background .2s, transform .15s;
}
.dl-button:hover{background:var(--brand-dark); transform:translateY(-1px);}
.dl-button svg{width:22px; height:22px; flex-shrink:0;}
.dl-button-text{display:flex; flex-direction:column; align-items:flex-start; line-height:1.3;}
.dl-size{font-size:11px; font-weight:600; opacity:.85; font-family:'IBM Plex Mono',monospace;}
.tpg-mirrors{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:16px;}
.mirror-btn{
  background:var(--card-bg); border:1px solid var(--line); color:var(--text);
  padding:9px 18px; border-radius:6px; font-size:13px; font-weight:700; transition:.2s;
}
.mirror-btn:hover{border-color:var(--brand); color:var(--brand);}

/* ===== RELATED POSTS ===== */
.tpg-related{margin-top:24px;}
.tpg-related-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.tpg-related-item{
  background:var(--card-bg); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  display:block; transition:border-color .2s;
}
.tpg-related-item:hover{border-color:var(--brand);}
.tpg-related-thumb{height:100px; overflow:hidden;}
.tpg-related-thumb img{width:100%; height:100%; object-fit:cover;}
.tpg-related-thumb .no-img{
  width:100%; height:100%; background:linear-gradient(135deg,var(--brand-dark),var(--header-bg));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:800;
}
.tpg-related-title{display:block; padding:10px 12px; font-size:13px; font-weight:700; line-height:1.4;}

/* ===== AUTHOR BOX ===== */
.tpg-author-box{display:flex; gap:14px; align-items:flex-start; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); padding:16px; margin-top:20px;}
.tpg-author-box img{border-radius:50%;}
.tpg-author-box p{margin:6px 0 0; font-size:13.5px; color:var(--text-muted);}

/* ===== BACK TO TOP ===== */
#tpg-back-to-top{
  position:fixed; bottom:24px; left:24px; width:44px; height:44px; border-radius:50%;
  background:var(--brand); color:#fff; border:0; font-size:18px; cursor:pointer;
  opacity:0; pointer-events:none; transform:translateY(10px); transition:.25s; z-index:60;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
#tpg-back-to-top.is-visible{opacity:1; pointer-events:auto; transform:translateY(0);}
#tpg-back-to-top:hover{background:var(--brand-dark);}

/* category page grid columns (Customizer: صفحات التصنيفات) */
body.cat-cols-2 .post-list{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
body.cat-cols-3 .post-list{display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px;}
body.cat-cols-2 .post-card .post-body,
body.cat-cols-3 .post-card .post-body{flex-direction:column;}
body.cat-cols-2 .post-thumb,
body.cat-cols-3 .post-thumb{width:100%; height:150px;}

@media(max-width:860px){
  body.cat-cols-2 .post-list, body.cat-cols-3 .post-list{grid-template-columns:1fr;}
  .layout{grid-template-columns:1fr !important;}
  .post-card .post-body{flex-direction:column;}
  .post-thumb{width:100%; height:180px;}
  .tpg-info-grid{grid-template-columns:repeat(2,1fr);}
  .tpg-screenshots-grid{grid-template-columns:repeat(2,1fr);}
  .tpg-related-grid{grid-template-columns:repeat(2,1fr);}
  .tpg-req-table td.tpg-req-label{width:45%;}
}