/*
Theme Name: GeneratePress Child — Left Image Layout
Theme URI:  https://example.com
Description: Child theme for GeneratePress — homepage posts with left image + right content and sidebar.
Author: Your Name
Template: generatepress
Version: 1.0
*/

/* Import parent GeneratePress styles */
@import url("../generatepress/style.css");

/* --------------------------------------------------
   Custom: Homepage Post Layout — Image Left, Content Right
   --------------------------------------------------*/

.home .gp-left-post {
  display:flex;
  align-items:flex-start;
  gap:18px;
  background:#fff;
  border-radius:10px;
  box-shadow:0 3px 10px rgba(0,0,0,0.06);
  margin-bottom:20px;
  padding:14px;
  transition:transform .18s ease, box-shadow .18s ease;
}

.home .gp-left-post:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 22px rgba(0,0,0,0.10);
}

/* Left thumbnail container */
.home .gp-left-post .gp-thumb {
  flex:0 0 180px;
  height:120px;
  border-radius:8px;
  overflow:hidden;
  background:#f2f4f6;
}

.home .gp-left-post .gp-thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Right content column */
.home .gp-left-post .gp-content {
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

/* Title */
.home .gp-left-post .entry-title {
  font-size:1.12rem;
  margin:0 0 6px 0;
  line-height:1.35;
  font-weight:700;
  color:#111827;
}

.home .gp-left-post .entry-title a{
  color:inherit;
  text-decoration:none;
}
.home .gp-left-post .entry-title a:hover{
  color:#d32f2f;
}

/* Meta */
.home .gp-left-post .entry-meta{
  font-size:13px;
  color:#6b7280;
  margin-bottom:8px;
}

/* Excerpt */
.home .gp-left-post .entry-summary{
  font-size:14px;
  color:#374151;
  line-height:1.5;
  margin:0 0 8px 0;
}

/* Footer (categories, comments) */
.home .gp-left-post .entry-footer{
  font-size:13px;
  color:#dc2626;
}

/* Default thumbnail wrapper fix */
.home .gp-left-post .post-thumbnail,
.home .gp-left-post .featured-image {
  margin:0;
  padding:0;
  border-radius:inherit;
}

/* Responsive stack */
@media (max-width:768px){
  .home .gp-left-post {
    flex-direction:column;
  }
  .home .gp-left-post .gp-thumb {
    width:100%;
    height:220px;
  }
}

/* -------------------------------
   Main + Sidebar Layout
----------------------------------- */
@media (min-width: 1024px) {
  .home .site-content {
    display: grid;
    grid-template-columns: 68% 30%; /* main + sidebar */
    gap: 2%;
    align-items: start;
  }

  .home .content-area,
  .home #primary {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }

  .home #secondary {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }
}

@media (max-width: 768px) {
  .home .site-content {
    display: block;
  }
}

/* -------------------------------
   ✅ FIX: Proper two-column layout (content + sidebar)
----------------------------------- */
@media (min-width: 992px) {
  body.home .site-content {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
  }

  body.home .content-area,
  body.home #primary {
    flex: 0 0 72%;
    max-width: 72%;
  }

  body.home #secondary {
    flex: 0 0 26%;
    max-width: 26%;
  }
}

/* ✅ Make sidebar neat */
#secondary .widget {
  background: #fff;
  padding: 16px;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
  margin-bottom: 20px;
}

#secondary .widget-title {
  font-size: 1rem;
  margin-bottom: 10px;
  border-bottom: 2px solid #ef4444;
  padding-bottom: 5px;
  color: #111;
}

/* ✅ Mobile fallback */
@media (max-width: 991px) {
  body.home .site-content {
    display: block;
  }
  body.home #secondary {
    margin-top: 30px;
  }
}