/* Public prayer page, monthly and yearly schedules. Static, so it needs no asset build.
   Emerald green, white and gold; compact; equal-height centre cards. */
.pp{--pp-green:#0b5d3f;--pp-green-dark:#063f2b;--pp-gold:#c9a227;--pp-gold-soft:#fbf3dc;--pp-ink:#13302a;--pp-muted:#56685f;--pp-line:#e1e8e3;--pp-mint:#e8f5ee;--pp-today:#dff2c9;max-width:1200px;margin:0 auto;padding:16px 16px 36px;color:var(--pp-ink);font-variant-numeric:tabular-nums}
.pp *{box-sizing:border-box}
.pp a{color:var(--pp-green)}
.pp :focus-visible{outline:3px solid var(--pp-gold);outline-offset:2px}

/* Hero */
.pp-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:150px;padding:22px 26px;border-radius:16px;overflow:hidden;color:#fff;background:linear-gradient(90deg,rgba(6,63,43,.96) 0%,rgba(6,63,43,.88) 45%,rgba(6,63,43,.35) 100%),url('/brand/hero/fhf-hero-1536.jpg') center/cover no-repeat,var(--pp-green-dark)}
.pp-hero h1{margin:2px 0 6px;font:700 clamp(1.9rem,3.6vw,2.8rem)/1.1 var(--fhf-font-display,Georgia,serif);color:#fff}
.pp-hero p{margin:0;max-width:520px;font-size:.92rem;line-height:1.5;color:#e8f1ec}
.pp-eyebrow{font-size:.7rem!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#e9c75b!important}
.pp-today-date{display:flex!important;align-items:center;gap:12px;flex:none;padding:12px 16px;border-radius:12px;background:#fff;color:var(--pp-ink)!important;font-size:.9rem!important;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.pp-today-date .fhf-icon{color:var(--pp-green)}
.pp-today-date small{display:block;margin-top:2px;color:var(--pp-muted);font-weight:500;font-size:.8rem}

/* Branch tabs: phones only */
.pp-branch-tabs{display:none}

/* Centre cards */
.pp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;margin-top:16px;align-items:stretch}
.pp-card{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px 18px;border:1px solid var(--pp-line);border-radius:16px;background:#fff;box-shadow:0 2px 10px rgba(6,63,43,.05)}
.pp-card-head{display:flex;align-items:center;gap:12px;min-height:56px}
.pp-card-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--pp-green);color:#fff}
.pp-card-head h2{margin:0;font:700 1.3rem/1.2 var(--fhf-font-display,Georgia,serif);color:var(--pp-green-dark)}
.pp-card-address{margin:3px 0 0;font-size:.82rem;color:var(--pp-muted)}
.pp-card-address a{font-weight:600;white-space:nowrap}
.pp-next{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:12px;background:var(--pp-mint);border:1px solid #d3eadc}
.pp-next p{margin:0}
.pp-next-label{font-size:.75rem;font-weight:600;color:var(--pp-muted)}
.pp-next-name{font:700 1.45rem/1.15 var(--fhf-font-display,Georgia,serif);color:var(--pp-green-dark)}
.pp-next-times{margin-top:2px!important;font-size:.82rem;color:#2e4b40}
.pp-countdown{display:flex;flex-direction:column;align-items:flex-end;flex:none;text-align:end}
.pp-countdown-label{font-size:.72rem;font-weight:600;color:var(--pp-muted)}
.pp-countdown strong{font-size:1.65rem;line-height:1.1;color:var(--pp-green-dark);direction:ltr}
.pp-today{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.92rem}
.pp-today th,.pp-today td{padding:7px 10px;border-bottom:1px solid var(--pp-line);text-align:start}
.pp-today thead th{padding-block:6px;background:#f2f5f3;color:var(--pp-muted);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.pp-today tbody th{font-weight:600}
.pp-today tr.is-next{background:var(--pp-mint)}
.pp-today tr.is-next th{color:var(--pp-green-dark);box-shadow:inset 3px 0 0 var(--pp-gold)}
.pp-today tr.is-next :is(th,td){font-weight:700}
.pp-today time{white-space:nowrap;direction:ltr}
.pp-jumuah{margin-top:auto;padding:10px 12px;border-radius:12px;background:var(--pp-gold-soft);border:1px solid #f0e2b4}
.pp-jumuah h3{margin:0 0 4px;font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#7a5d00}
.pp-jumuah ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:4px 16px;margin:0;padding:0;list-style:none}
.pp-jumuah li{display:flex;flex-direction:column;font-size:.86rem}
.pp-jumuah li strong{color:var(--pp-ink)}
.pp-jumuah li span{color:#3c4f47}
.pp-jumuah-none{margin:0;font-size:.85rem;color:#5e5130}
.pp-unavailable{margin:0;padding:12px 14px;border-radius:12px;background:#f6f6f2;border:1px dashed #cfd6d1;color:var(--pp-muted);font-size:.9rem}

/* Section buttons */
.pp-sections{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 12px}
.pp-sections a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid #cfdcd5;border-radius:10px;background:#fff;color:var(--pp-green-dark);font-size:.9rem;font-weight:700;text-decoration:none}
.pp-sections a:hover{background:var(--pp-mint)}
.pp-sections a.is-primary{background:var(--pp-green);border-color:var(--pp-green);color:#fff}

/* Monthly panel */
.pp-panel{padding:16px 18px;border:1px solid var(--pp-line);border-radius:16px;background:#fff;box-shadow:0 2px 10px rgba(6,63,43,.05)}
.pp-panel-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px;margin-bottom:12px}
.pp-panel-head>div{flex:1 1 280px;min-width:0}
.pp-panel-icon{display:inline-flex;align-items:center;justify-content:center;align-self:center;flex:none;width:48px;height:48px;border-radius:12px;background:var(--pp-mint);color:var(--pp-green)}
.pp-panel-head h2{margin:0;font:700 1.35rem/1.2 var(--fhf-font-display,Georgia,serif);color:var(--pp-green-dark)}
.pp-panel-head h2 span{color:var(--pp-gold);font-family:inherit}
.pp-panel-head p{margin:2px 0 0;font-size:.85rem;color:var(--pp-muted)}
.pp-picker{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}
.pp-picker label{display:flex;flex-direction:column;gap:3px;font-size:.75rem;font-weight:700;color:var(--pp-ink)}
.pp-picker select,.pp-picker input{min-width:160px;height:42px;padding:0 10px;border:1px solid #cfdcd5;border-radius:10px;background:#fff;color:var(--pp-ink);font:inherit;font-weight:500}
.pp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border:0;border-radius:10px;background:var(--pp-green);color:#fff;font-weight:700;font-size:.9rem;cursor:pointer;text-decoration:none}
.pp-btn:hover{background:var(--pp-green-dark)}
.pp-btn-ghost{background:#fff;color:var(--pp-green-dark);box-shadow:inset 0 0 0 1px #cfdcd5}
.pp-btn-ghost:hover{background:var(--pp-mint)}

/* Monthly table */
.pp-table-scroll{max-width:100%;overflow-x:auto;border:1px solid var(--pp-line);border-radius:12px;-webkit-overflow-scrolling:touch}
.pp-month{width:100%;min-width:900px;border-collapse:separate;border-spacing:0;font-size:.82rem}
.pp-month th,.pp-month td{padding:5px 7px;border-bottom:1px solid #edf1ee;text-align:center;white-space:nowrap}
.pp-month thead th{position:sticky;top:0;z-index:1;padding-block:7px;background:var(--pp-green);color:#fff;font-size:.74rem;font-weight:700;line-height:1.2}
.pp-month thead th span{display:block;font-weight:500;opacity:.85}
.pp-month thead th.pp-iqamah{background:#0f6b49}
.pp-month tbody tr:nth-child(even) :is(th,td){background:#f6f9f7}
.pp-month tbody th{font-weight:700;text-align:start}
.pp-month td.pp-iqamah{color:var(--pp-green-dark);font-weight:600}
.pp-month .pp-hijri{color:var(--pp-muted);font-size:.76rem}
.pp-month .pp-sticky{position:sticky;left:0;z-index:2;background:#fff;box-shadow:1px 0 0 var(--pp-line)}
.pp-month thead .pp-sticky{z-index:3;background:var(--pp-green)}
.pp-month tbody tr.is-today :is(th,td){background:var(--pp-today)!important;font-weight:700}
.pp-month .pp-missing{color:var(--pp-muted);font-style:italic}
.pp-note{margin:8px 2px 0;font-size:.76rem;color:var(--pp-muted)}
.pp-footnote{margin:14px 2px 0;font-size:.78rem;color:var(--pp-muted)}

/* Downloads */
.pp-downloads{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;margin-top:14px}
.pp-download{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:8px 16px;border-radius:10px;background:var(--pp-green);color:#fff!important;text-decoration:none}
.pp-download:hover{background:var(--pp-green-dark)}
.pp-download strong{display:block;font-size:.9rem}
.pp-download small{display:block;font-size:.74rem;opacity:.85}
.pp-download-alt{background:#fff;color:var(--pp-green-dark)!important;box-shadow:inset 0 0 0 1px #cfdcd5}
.pp-download-alt:hover{background:var(--pp-mint)}
.pp-download-note{display:flex;align-items:center;gap:8px;flex:1 1 260px;margin:0;padding:8px 14px;border-radius:10px;background:var(--pp-gold-soft);color:#5e5130;font-size:.8rem}

/* Yearly */
.pp-months{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin:12px 0}
.pp-months a{display:flex;align-items:center;justify-content:center;min-height:40px;border:1px solid #cfdcd5;border-radius:10px;background:#fff;font-size:.82rem;font-weight:700;text-decoration:none}
.pp-months a[aria-current]{background:var(--pp-green);border-color:var(--pp-green);color:#fff}
.pp-year-month{margin-top:16px}
.pp-year-month h3{margin:0 0 8px;font:700 1.15rem var(--fhf-font-display,Georgia,serif);color:var(--pp-green-dark)}
.pp-back{display:inline-flex;align-items:center;gap:6px;min-height:40px;margin-bottom:8px;font-weight:700;text-decoration:none}

@media (max-width:767px){
  .pp{padding:10px 12px 28px}
  .pp-hero{flex-direction:column;align-items:flex-start;min-height:0;padding:18px;background:linear-gradient(180deg,rgba(6,63,43,.94),rgba(6,63,43,.88)),url('/brand/hero/fhf-hero-640.jpg') center/cover,var(--pp-green-dark)}
  .pp-hero h1{font-size:1.9rem}
  .pp-today-date{padding:8px 12px;font-size:.85rem!important}
  .pp-branch-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;margin-top:12px;padding:4px;border-radius:12px;background:#eef3f0}
  .pp-branch-tabs button{min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--pp-green-dark);font-weight:700;font-size:.95rem;cursor:pointer}
  .pp-branch-tabs button[aria-selected=true]{background:var(--pp-green);color:#fff}
  .pp-cards{margin-top:10px}
  .pp-card[data-pp-unselected]{display:none}
  .pp-card{padding:14px}
  .pp-card-head h2{font-size:1.15rem}
  .pp-next{padding:10px 12px}
  .pp-next-name{font-size:1.25rem}
  .pp-countdown strong{font-size:1.35rem}
  .pp-today{font-size:.88rem}
  .pp-today th,.pp-today td{padding:7px 6px}
  .pp-sections{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .pp-sections a{justify-content:center;padding:0 8px;font-size:.84rem}
  .pp-panel{padding:12px}
  .pp-panel-icon{display:none}
  .pp-picker{width:100%}
  .pp-picker label{flex:1 1 140px}
  .pp-picker select{min-width:0;width:100%;height:44px}
  .pp-picker .pp-btn{flex:1 1 100%;min-height:44px}
  .pp-month{min-width:760px;font-size:.78rem}
  .pp-month .pp-hijri{display:none}
  .pp-downloads{display:grid;grid-template-columns:1fr}
  .pp-download{min-height:52px}
  .pp-months{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media (max-width:360px){.pp-sections{grid-template-columns:1fr}}
@media print{
  .fhf-desktop-header,.fhf-mobile-header,.fhf-footer,.fhf-bottom-nav,.fhf-public-back,.pp-hero,.pp-branch-tabs,.pp-sections,.pp-picker,.pp-downloads,.pp-months,.pp-back{display:none!important}
  .pp-card[data-pp-unselected]{display:flex}
  .pp-table-scroll{overflow:visible;border:0}
  .pp-month{min-width:0;font-size:8pt}
  .pp-month thead{display:table-header-group}
}
.pp-title{margin:0;font:700 1.35rem/1.2 var(--fhf-font-display,Georgia,serif);color:var(--pp-green-dark)}
.pp-title span{color:var(--pp-gold)}
.pp-month-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-bottom:10px}
.pp-month-nav .pp-btn{min-height:40px;font-size:.85rem}
.pp-panel-head>.pp-picker{flex:0 1 auto;flex-wrap:nowrap;margin-left:auto}
.pp-picker .pp-btn{width:auto;flex:none}
.pp-month thead th.pp-hijri{color:#fff;font-size:.74rem}
@media (max-width:767px){.pp-panel-head>.pp-picker{flex-wrap:wrap;margin-left:0}.pp-picker .pp-btn{flex:1 1 100%}}
.pp .pp-picker{display:flex!important}@media (min-width:768px){.pp .pp-picker{flex-wrap:nowrap!important}.pp .pp-picker .pp-btn{width:auto!important;margin:0!important}}
@media (max-width:767px){.pp-month-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.pp-month-nav .pp-btn{padding:0 6px;font-size:.8rem;min-height:44px;width:auto!important}}