/*
Theme Name: Games Grid Theme
Theme URI: https://example.com/
Author: Abdlrhman Katr
Description: Lightweight theme to display games as a grid (8 per row desktop, 4 per row mobile) and categories below. RTL-ready and uses active theme colors.
Version: 1.0
Text Domain: games-grid-theme
*/
:root{
  --ggt-bg: transparent;
  --ggt-text: inherit;
  --ggt-accent: inherit;
  --ggt-card-bg: #fff;
  --ggt-card-radius: 10px;
  --ggt-gap: 14px;
}
html,body{height:100%;margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;color:var(--ggt-text);background:var(--ggt-bg);direction:rtl}
a{color:inherit;text-decoration:none}
.site-wrap{max-width:1200px;margin:0 auto;padding:20px}
.posts-grid{
  display:grid;
  grid-template-columns:repeat(var(--ggt-columns-desktop,8),1fr);
  gap:var(--ggt-gap);
}
.post-card{
  background:var(--ggt-card-bg);
  border-radius:var(--ggt-card-radius);
  overflow:hidden;
  box-shadow:0 6px 18px rgba(0,0,0,0.06);
  position:relative;
}
.post-card img{width:100%;height:170px;object-fit:cover;display:block;transition:transform .25s ease}
.post-card:hover img{transform:scale(1.04)}
.post-title{padding:8px 10px;font-size:14px;text-align:center}
.categories-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:12px;
  margin-top:28px;
  padding-top:6px;
}
.category-card{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--ggt-card-bg);
  border-radius:8px;
  padding:10px;
  box-shadow:0 6px 18px rgba(0,0,0,0.04);
}
.category-card img{width:72px;height:72px;object-fit:cover;border-radius:8px;flex-shrink:0}
.cat-name{font-size:16px}
.site-info{margin-top:28px;padding:18px 10px;background-color:#191725 !important;;border-top:1px solid rgba(0,0,0,0.06); text-align:center !important;}
.footer-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.footer-links a{color:#ffffff; text-decoration:none;}
.back-to-top{position:fixed;right:20px;bottom:20px;background:var(--ggt-accent);color:#fff;padding:10px;border-radius:999px;display:none;cursor:pointer;z-index:9999}
@media (max-width:1024px){
  .posts-grid{grid-template-columns:repeat(var(--ggt-columns-tablet,6),1fr)}
}
@media (max-width:600px){
  .posts-grid{grid-template-columns:repeat(var(--ggt-columns-mobile,4),1fr)}
  .post-card img{height:140px}
  .category-card{flex-direction:row-reverse}
}
