/* assets/css/testimonies.css
   Scoped styles for pages/testimonies.php
   Safe: all selectors begin with .page-reviews to avoid cross-page bleed.
*/

/* base layout & spacing (page-scoped) */
.page-reviews {
  --card-bg: #ffffff;
  --muted: #6b7280;
  --accent: #0b63d6;
  --radius: 12px;
  --shadow: 0 10px 28px rgba(11,18,34,0.06);
  padding: 20px;
}

/* page header: margin top lives inside page so it scrolls with content */
.page-reviews .page-header {
  margin-top: 78px;          /* page specific spacing (adjust if your header height differs) */
  margin-bottom: 18px;
}
@media (max-width: 800px) {
  .page-reviews .page-header { margin-top: 60px; padding-left: 12px; padding-right: 12px; }
}

/* header typography */
.page-reviews .page-title {
  font-size: 2rem;
  margin: 0 0 6px;
  color: #0b213b;
  line-height: 1.05;
}
.page-reviews .page-sub {
  margin: 0;
  color: var(--muted);
  font-size: 0.98rem;
}

/* grid of review cards */
.page-reviews .reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
  margin-top: 12px;
  margin-bottom: 22px;
}

/* card */
.page-reviews .review-card {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: var(--card-bg);
  padding: 14px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease;
  min-height: 120px;
  overflow: hidden;
}

.page-reviews .review-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(11,18,34,0.09);
}

/* avatar */
.page-reviews .review-card img {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: #f3f4f6;
  border: 2px solid rgba(11,18,34,0.04);
}

/* body */
.page-reviews .card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.page-reviews .card-body h3 {
  margin: 0;
  font-size: 1.05rem;
  color: #0b213b;
  line-height: 1.15;
}
.page-reviews .card-body time {
  color: var(--muted);
  font-size: 0.85rem;
  display: block;
}
.page-reviews .card-body p {
  margin: 0;
  color: #111827;
  font-size: 0.96rem;
  line-height: 1.5;
  white-space: pre-wrap; /* preserve line breaks from server safely */
  word-wrap: break-word;
}

/* empty state */
.page-reviews .empty-state {
  text-align: center;
  padding: 36px 18px;
  border-radius: var(--radius);
  background: #fffdf7;
  border: 1px solid rgba(255,214,107,0.12);
  color: #0b213b;
  box-shadow: var(--shadow);
}

/* pagination - centered & responsive */
.page-reviews .pagination {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin: 26px 0 48px;
  flex-wrap:wrap;
}

/* link styles for pagination */
.page-reviews .pagination a.page-prev,
.page-reviews .pagination a.page-next,
.page-reviews .pagination a.page-link,
.page-reviews .pagination span.page-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:44px;
  padding:0 12px;
  border-radius:10px;
  font-weight:600;
  font-size:0.95rem;
  text-decoration:none;
  color:#0b213b;
  background:#fff;
  border:1px solid #e6e9ef;
  box-shadow: 0 6px 18px rgba(11,18,34,0.03);
}

/* active page */
.page-reviews .pagination .page-link.active,
.page-reviews .pagination .page-link.active[aria-current="page"] {
  background: linear-gradient(135deg,#ffd86b,#f5b700);
  color:#111;
  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
}

/* disabled states */
.page-reviews .pagination .disabled {
  opacity:.45;
  pointer-events:none;
  background:#fafafa;
}

/* ellipsis */
.page-reviews .pagination .ellipsis {
  color: var(--muted);
  display:inline-block;
  padding: 0 6px;
}

/* focus (keyboard accessible) */
.page-reviews .pagination a:focus,
.page-reviews .review-card:focus-within {
  outline: 3px solid rgba(11,99,214,0.14);
  outline-offset: 4px;
}















/* small viewports adjustments */
@media (max-width: 860px) {
  .page-reviews .review-card { padding:12px; min-height: 100px; }
  .page-reviews .review-card img { width:80px; height:80px; }
  .page-reviews .card-body p { font-size:0.94rem; }
  .page-reviews .pagination { gap:8px; margin:18px 0 36px; }
}

@media (max-width: 520px) {
  .page-reviews { padding-left:12px; padding-right:12px; }
  .page-reviews .reviews-grid { gap:12px; }
  .page-reviews .review-card { flex-direction: column; align-items:flex-start; gap:10px; }
  .page-reviews .review-card img { width:72px; height:72px; }
  .page-reviews .card-body h3 { font-size:1rem; }
  .page-reviews .card-body p { font-size:0.94rem; }
  .page-reviews .pagination a.page-prev, .page-reviews .pagination a.page-next { min-width:36px; height:36px; }
}

/* small utility: ensure images that fail gracefully show a circular background */
.page-reviews .review-card img[alt=""]{ background: #f3f4f6; }