/* IslamOnline-like portal layout (structure match, not copying their proprietary assets) */

:root{
  --bg:#f6f7f9;
  --text:#111827;
  --muted:#6b7280;
  --card:#ffffff;
  --line:#e5e7eb;
  --brand:#0b5ed7;
  --brand2:#0ea5e9;
  --radius:14px;
  --shadow: 0 10px 25px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;height:auto}

.container{max-width:1180px;margin:0 auto;padding:0 16px}

/* ===== Layout ===== */
.alw-main{padding:18px 0 50px}
.alw-grid{
  display:grid;
  grid-template-columns: 1.65fr .85fr;
  gap:18px;
}
@media (max-width: 980px){
  .alw-grid{grid-template-columns:1fr}
}

/* ===== Sections ===== */
.alw-section{margin:0 0 18px}
.alw-section__head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin:0 0 12px;
}
.alw-section__title{margin:0;font-size:18px}
.alw-section__more{color:var(--brand);font-weight:800}
.alw-section__more:hover{text-decoration:underline}

/* ===== Cards (Recent + Read More) ===== */
.alw-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
}
@media (max-width: 980px){ .alw-cards{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 620px){ .alw-cards{grid-template-columns:1fr} }

.alw-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius: var(--radius);
  overflow:hidden;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
.alw-card__thumb{display:block}
.alw-card__thumb--placeholder{height:160px;background:linear-gradient(135deg,#eef2ff,#f1f5f9)}
.alw-card__body{padding:14px}
.alw-card__title{margin:0 0 8px;font-size:15.5px;line-height:1.25}
.alw-card__title a:hover{text-decoration:underline}
.alw-card__meta{font-size:12px;color:var(--muted);margin:0 0 8px}
.alw-card__excerpt{margin:0;color:#374151;font-size:13.5px;line-height:1.55}

/* ===== Category Tiles (Main Sections) ===== */
.alw-tiles{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
}
@media (max-width: 980px){ .alw-tiles{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 620px){ .alw-tiles{grid-template-columns:1fr} }

.alw-tile{
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:14px;
  display:flex;flex-direction:column;gap:6px;
}
.alw-tile__name{font-weight:900}
.alw-tile__count{color:var(--muted);font-size:12px}

/* ===== Compact Lists (About Muhammad / Sharia / Archive / Audio) ===== */
.alw-compact{
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--radius);
  overflow:hidden;
}
.alw-compact__item{
  padding:12px 14px;
  border-top:1px solid var(--line);
}
.alw-compact__item:first-child{border-top:0}
.alw-compact__title{margin:0 0 4px;font-size:14.5px;line-height:1.25}
.alw-compact__title a:hover{text-decoration:underline}
.alw-compact__meta{font-size:12px;color:var(--muted)}

/* ===== Sidebar ===== */
.alw-box{
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:14px;
  margin:0 0 12px;
}
.alw-box__title{margin:0 0 10px;font-size:16px}
.alw-muted{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 10px}

.alw-toplist{margin:0;padding-left:18px}
.alw-toplist__item{margin:0 0 10px}
.alw-toplist__item a{font-weight:800}
.alw-toplist__item a:hover{text-decoration:underline}
.alw-toplist__meta{display:block;color:var(--muted);font-size:12px;margin-top:2px}

.alw-newsletter{display:flex;gap:8px}
.alw-newsletter input{
  flex:1;
  padding:10px 12px;border:1px solid var(--line);
  border-radius:12px; outline:none;
}
.alw-newsletter button{
  padding:10px 12px;border:0;border-radius:12px;
  background: linear-gradient(90deg,var(--brand),var(--brand2));
  color:#fff;font-weight:900;cursor:pointer;
}

/* Pagination */
.alw-pagination{margin-top:18px}