/* ============================================================
   dikr — prayer times per city (/مواقيت-الصلاة-في-…/)
   ============================================================ */
.pc-body { --pc-card: #fff; --pc-ink: #16242f; --pc-muted: #5f6b76; --pc-gold: #c08a1e; }
body.dark.pc-body { --pc-card: #1c1c1e; --pc-ink: #f2f2f7; --pc-muted: #a1a1a8; --pc-gold: #e6b450; }

.pc-wrap { max-width: 980px; margin: 0 auto; padding: 18px 16px 48px; }
.pc-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--pc-muted); margin-bottom: 12px; }
.pc-crumbs a { color: var(--pc-muted); text-decoration: none; }
.pc-crumbs a:hover { color: var(--blue-dark); }
.pc-head { text-align: center; margin-bottom: 18px; }
.pc-head h1 { font-size: clamp(26px, 4.6vw, 38px); line-height: 1.4; color: var(--pc-ink); margin: 0 0 6px; text-wrap: balance; }
.pc-date { color: var(--pc-muted); font-size: 16px; line-height: 1.9; margin: 0; }
.pc-date a { color: var(--blue-darker); }
body.dark .pc-date a { color: var(--blue); }

.pc-today { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.pc-card {
  background: var(--pc-card); border: 1px solid var(--separator); border-radius: 16px;
  padding: 14px 8px; text-align: center; display: flex; flex-direction: column; gap: 4px;
  transition: border-color .2s, box-shadow .2s;
}
.pc-label { font-size: 15px; color: var(--pc-muted); }
.pc-time { font-size: 22px; color: var(--pc-ink); font-variant-numeric: tabular-nums; }
.pc-left { font-size: 12.5px; color: var(--blue-darker); min-height: 1.4em; }
body.dark .pc-left { color: var(--blue); }
.pc-card.is-sunrise .pc-time { color: var(--pc-muted); }
.pc-card.is-next {
  border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-glow);
  background: linear-gradient(180deg, var(--blue-bg), var(--pc-card));
}
.pc-card.is-next .pc-label { color: var(--blue-darker); font-weight: 700; }
body.dark .pc-card.is-next .pc-label { color: var(--blue); }
.pc-next { text-align: center; color: var(--pc-ink); font-size: 16px; margin: 12px 0 0; }

.pc-section { margin-top: 28px; }
.pc-section h2 { font-size: 21px; color: var(--pc-ink); margin: 0 0 10px; }
.pc-note { color: var(--pc-muted); font-size: 15px; line-height: 1.9; margin: 0 0 10px; }
.pc-table-wrap { overflow-x: auto; background: var(--pc-card); border: 1px solid var(--separator); border-radius: 14px; }
.pc-table { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 560px; }
.pc-table th { background: var(--blue-bg); color: var(--pc-ink); font-weight: 700; padding: 9px 8px; white-space: nowrap; }
.pc-table td { padding: 8px; text-align: center; border-top: 1px solid var(--separator); color: var(--pc-ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pc-table td:first-child { text-align: right; color: var(--pc-muted); }
.pc-table tr.is-today td { background: color-mix(in srgb, var(--blue) 14%, transparent); font-weight: 700; }
.pc-ramadan h2::before { content: '☾ '; color: var(--pc-gold); }
.pc-iftar { color: var(--pc-gold) !important; font-weight: 700; }

.pc-about p { color: var(--pc-muted); font-size: 16px; line-height: 2; margin: 0 0 8px; }
.pc-about a { color: var(--blue-darker); font-weight: 700; }
body.dark .pc-about a { color: var(--blue); }
.pc-links { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-links a {
  text-decoration: none; color: var(--pc-ink); background: var(--pc-card);
  border: 1px solid var(--separator); padding: 6px 14px; border-radius: 999px; font-size: 15px;
}
.pc-links a:hover { border-color: var(--blue-border); color: var(--blue-dark); }
.pc-all { display: inline-block; margin-top: 12px; font-weight: 700; color: var(--blue-darker); text-decoration: none; }
body.dark .pc-all { color: var(--blue); }

@media (max-width: 760px) {
  .pc-today { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pc-time { font-size: 20px; }
}