/*
Theme Name: Rewardzy Child
Theme URI: https://rewardzy.me/
Description: Child theme implementing Rewardzy app listings (Coming Soon, Popular, On Sale) based on provided GrapesJS HTML. Requires parent theme Hello Elementor.
Author: Rewardzy
Author URI: https://rewardzy.me/
Template: hello-elementor
Version: 1.0.0
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rewardzy-child
*/

/* Basic resets & typography */
body {font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', Arial, sans-serif; margin:0; background:#101114; color:#f5f7fa;}
.main-container {display:flex; min-height:100vh;}
.page-layout {display:flex; width:100%; max-width:1320px; margin:0 auto;}
.sidebar {width:260px; background:#16181d; padding:1.25rem; box-sizing:border-box; border-right:1px solid #24272d;}
.content-area {flex:1; padding:2rem 2.5rem;}
.gjs-t-h1,.header-title {font-size:1.75rem; line-height:1.2; margin:0 0 .5rem; font-weight:600;}
.header-subtitle {margin:0 0 2rem; color:#b3b9c5;}
.brand-row {display:flex; gap:.75rem; align-items:center; margin-bottom:1.5rem;}
.brand-logo {border-radius:16px; width:56px; height:56px; object-fit:cover; background:#23262b;}
.brand-title {margin:0; font-size:1.25rem; font-weight:600;}
.brand-subtitle {margin:.25rem 0 0; font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:#8b919a;}
.sidebar-menu {display:flex; flex-direction:column; gap:.5rem;}
.menu-item {display:flex; align-items:center; justify-content:space-between; text-decoration:none; font-size:.85rem; padding:.65rem .75rem; border-radius:8px; background:#1c1e23; color:#e3e6eb; transition:background .15s, color .15s;}
.menu-item:hover {background:#272b33; color:#fff;}
.menu-item-title {font-weight:500;}
.status-badge {font-size:.6rem; padding:.25rem .45rem; background:#2a313b; color:#fff; border-radius:6px; text-transform:uppercase; letter-spacing:.05em;}

/* Grids */
.coming-soon-grid, .popular-grid {display:grid; gap:1rem;}
.coming-soon-grid {grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); margin-bottom:2.25rem;}
.popular-grid {grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); margin-bottom:2.25rem;}
.section-header {display:flex; align-items:center; justify-content:space-between; margin-bottom:.75rem;}
.section-title {margin:0; font-size:1.25rem; font-weight:600;}
.see-all-link {font-size:.75rem; text-decoration:none; color:#5fa8ff; font-weight:500;}
.see-all-link:hover {text-decoration:underline;}

/* Cards */
.coming-soon-card, .popular-card, .sale-card {background:#1a1d22; border:1px solid #242b33; border-radius:16px; padding:1rem 1rem 1.15rem; display:flex; flex-direction:column; gap:.75rem; position:relative;}
.card-header-row, .card-body-row, .popular-title-row, .sale-meta-row, .sale-tags-and-button {display:flex; align-items:center; justify-content:space-between;}
.card-body-row {gap:1rem;}
.app-thumbnail {width:72px; height:72px; border-radius:20px; object-fit:cover; background:#23262b;}
.badge {font-size:.55rem; padding:.3rem .5rem; background:#3b82f6; color:#fff; border-radius:6px; font-weight:600; letter-spacing:.05em;}
.card-title, .popular-title, .sale-title {margin:0; font-size:1rem; font-weight:600;}
.meta-date, .card-subtitle, .popular-description, .sale-description {font-size:.7rem; color:#9aa2ad; margin:0;}
.card-description {font-size:.75rem; line-height:1.35; margin:.5rem 0 0; color:#c8ced6;}
.rating-value {font-size:.7rem; font-weight:600; background:#232a31; padding:.35rem .55rem; border-radius:8px;}
.tag-group, .sale-tags-and-button {display:flex; gap:.4rem; flex-wrap:wrap;}
.tag, .tag-badge {font-size:.55rem; padding:.3rem .5rem; background:#2d333b; color:#d5dae0; border-radius:6px; text-transform:uppercase; letter-spacing:.05em;}
.tag-badge {background:#39414b;}
.publish-date {font-size:.6rem; color:#7e8691;}
.gjs-t-button.view-button {display:inline-flex; align-items:center; gap:.4rem; background:#2563eb; color:#fff; text-decoration:none; font-size:.65rem; padding:.45rem .75rem; border-radius:10px; font-weight:600; letter-spacing:.03em;}
.gjs-t-button.view-button:hover {background:#1d4ed8;}
.icon-arrow {width:14px; height:14px;}

/* Utility */
.popular-section, .on-sale-section {margin-bottom:2.75rem;}
.title-row {display:flex; align-items:center; justify-content:space-between; gap:.5rem;}
.sale-content {display:flex; flex-direction:column; gap:.4rem;}
.sale-meta-row {gap:.5rem;}

/* Responsive */
@media (max-width: 880px){
  .page-layout {flex-direction:column;}
  .sidebar {width:100%; display:flex; flex-direction:row; overflow-x:auto;}
  .sidebar-menu {flex-direction:row; flex-wrap:wrap;}
}