/* WebHatim V12 — Restore V10 homepage geometry, retain V11 block/menu editor.
 * IMPORTANT: load after v11.css. Only home layout is affected; readers and admin
 * continue to use their existing V11 styles.
 */

/* V11 unintentionally overrode the original .container max-width with 100%.
   The hero background remains edge-to-edge, but its inner text stays centered. */
.wh11-home .container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 26px;
  padding-right: 26px;
  min-width: 0;
}
.wh11-home { width: 100%; max-width: 100%; }
.wh11-home-block { min-width: 0; max-width: 100%; }
.wh11-home .hero,
.wh11-home .hero-slider { width: 100%; max-width: 100%; margin: 0; border-radius: 0; }
.wh11-zone--top > .wh11-home-block:not(:first-child) { margin-top: 0; }
.wh11-home-content { padding-top: 0; padding-bottom: 4px; }

/* V10 has one continuous full-width stats row above the two-column content. */
.wh11-zone--wide,
.wh11-zone--bottom { display: block; margin: 0; min-width: 0; }
.wh11-zone--wide .stats-grid { margin: 28px 0 44px; }
.wh11-zone--bottom { margin-top: 0; }

/* Keep V10's three reading choices and section spacing; V11's two-column cards
   and forced row gaps made the whole homepage unnecessarily tall. */
.wh11-zone--main {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  align-items: stretch;
}
.wh11-zone--main .feature-grid,
.wh11-zone--main .news-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wh11-zone--main .feature-grid,
.wh11-zone--main .surah-grid { margin-top: 0; }
.wh11-zone--main .section-after { margin-top: 48px; }
.wh11-zone--main .wh11-home-block { width: 100%; }

/* V10's right rail is a compact stack of independently managed cards. */
.wh11-zone--side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
  min-width: 0;
}
.wh11-zone--side > .wh11-home-block { min-width: 0; width: 100%; }
.wh11-zone--side .sidebar-heading { padding: 7px 0 2px; }
.wh11-zone--side .widget { margin-bottom: 1px; }

/* V10 sidebar proportions and adaptive column width. */
@media (min-width: 1121px) {
  .wh11-home .content-layout.wh11-layout-columns {
    grid-template-columns: minmax(0, 1fr) 298px;
    gap: 28px;
  }
}
@media (min-width: 881px) and (max-width: 1120px) {
  .wh11-home .container { padding-left: clamp(18px, 2.2vw, 26px); padding-right: clamp(18px, 2.2vw, 26px); }
  .wh11-home .content-layout.wh11-layout-columns {
    grid-template-columns: minmax(0, 1fr) 240px;
    gap: 17px;
  }
}
@media (max-width: 880px) {
  .wh11-home .container { padding-left: 18px; padding-right: 18px; }
  .wh11-home .content-layout.wh11-layout-columns { grid-template-columns: 1fr; }
  /* V10 shows sidebar cards two-up on tablets. */
  .wh11-zone--side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .wh11-zone--side > .wh11-home-block.wh11-type-sidebar_heading { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .wh11-home .container { padding-left: 15px; padding-right: 15px; }
  .wh11-zone--main .feature-grid,
  .wh11-zone--main .news-grid { grid-template-columns: 1fr; }
  .wh11-zone--main .section-after { margin-top: 33px; }
  .wh11-zone--wide .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 15px 0 35px; }
  .wh11-zone--side { grid-template-columns: 1fr; }
}

/* Admin: explicit revert control, no changes to the existing drag editor. */
.wh12-restore-panel{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.wh12-restore-description{flex:1;min-width:220px}
.wh12-restore-description strong{color:#16583e;font-size:15px}
.wh12-restore-description p{margin:5px 0 0;font-size:13px}
.wh12-restore-panel form{margin:0}
@media(max-width:620px){.wh12-restore-panel form,.wh12-restore-panel button{width:100%}}
