/* PrayerWaqt city-page extension.
   Intentionally builds on /assets/css/style.css from PrayerWaqt Web Home v1.2. */
body.city-page{background:var(--canvas)}
.city-page .header .brand{display:flex;align-items:center}
.city-page .header .brand img{height:36px}
.city-page .header-actions{position:relative}
.city-language-switch{display:flex;align-items:center;gap:6px;padding:4px;border:1px solid var(--outline);border-radius:14px;background:rgba(255,255,255,.82)}
.city-language-switch a{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border-radius:10px;font-size:12px;font-weight:800;color:var(--muted)}
.city-language-switch a.active{background:#e8f4f1;color:var(--petrol-deep)}
.city-mobile-languages{display:flex!important;gap:8px;padding-top:8px!important}
.city-mobile-languages a{display:inline-flex!important;padding:9px 12px!important;background:#fff;border:1px solid var(--outline)}
.city-mobile-languages a.active{border-color:rgba(10,109,97,.28);background:#e8f4f1;color:var(--petrol-deep)}

.city-hero{position:relative;overflow:hidden;padding:72px 0 64px}
.city-hero:before{content:"";position:absolute;right:-130px;top:20px;width:500px;height:500px;border-radius:50%;background:rgba(118,216,199,.20);filter:blur(60px)}
.city-hero:after{content:"";position:absolute;left:-150px;bottom:-180px;width:400px;height:400px;border-radius:50%;background:rgba(232,193,95,.12);filter:blur(60px)}
.city-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:52px;align-items:center}
.city-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:22px;font-size:12px;font-weight:650;color:#83908b}
.city-breadcrumbs a{color:var(--petrol)}
.city-breadcrumbs i{font-size:9px;color:#a9b3af}
.city-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border:1px solid var(--outline);border-radius:999px;background:rgba(255,255,255,.82);font-size:11px;font-weight:850;letter-spacing:.15em;text-transform:uppercase;color:var(--petrol-deep)}
.city-kicker i{color:var(--gold-strong)}
.city-hero h1{margin:18px 0 0;max-width:760px;font-size:clamp(46px,6vw,70px);line-height:1.01;letter-spacing:-.055em}
.city-hero h1 span{display:block;color:var(--petrol-deep)}
.city-lead{max-width:690px;margin:22px 0 0;font-size:18px;line-height:1.7;color:var(--muted)}
.city-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}
.city-meta-card{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--outline);border-radius:15px;background:rgba(255,255,255,.88);box-shadow:0 7px 24px rgba(0,28,25,.04)}
.city-meta-card i{color:var(--petrol)}
.city-meta-card small{display:block;font-size:10px;color:#89948f}
.city-meta-card strong{display:block;margin-top:1px;font-size:12px;color:#34413b}
.city-meta-card.source{border-color:rgba(232,193,95,.34);background:#fffaf0}
.city-meta-card.source i,.city-meta-card.source strong{color:#8b681d}
.city-meta-card.city-local-time{min-width:178px;border-color:rgba(10,109,97,.20);background:#f7fcfa}
.city-meta-card.city-local-time strong{font-size:20px;line-height:1;color:var(--petrol-deep);letter-spacing:-.02em}
.city-meta-timezone{display:block;margin-top:4px;font-size:9px;line-height:1.2;color:#8a9691;overflow-wrap:anywhere}

.city-next-card{position:relative;overflow:hidden;min-height:390px;padding:34px;border-radius:34px;color:#fff;background:radial-gradient(circle at 80% 12%,rgba(232,193,95,.24),transparent 28%),linear-gradient(155deg,#0a776a 0%,#075b52 54%,#073b36 100%);box-shadow:0 34px 86px rgba(0,28,25,.24)}
.city-next-card:before,.city-next-card:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.09)}
.city-next-card:before{width:250px;height:250px;right:-105px;bottom:-95px;box-shadow:0 0 0 38px rgba(255,255,255,.022),0 0 0 76px rgba(255,255,255,.014)}
.city-next-card:after{width:130px;height:130px;left:-75px;top:-75px;box-shadow:0 0 0 28px rgba(232,193,95,.025)}
.city-next-top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.city-next-top .label{font-size:11px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.city-next-top .date{margin-top:6px;font-size:13px;color:rgba(255,255,255,.58)}
.city-next-top img{width:48px;height:48px;padding:7px;border-radius:15px;background:rgba(255,255,255,.09);object-fit:contain}
.city-next-name{position:relative;margin-top:46px;font-size:26px;font-weight:700;color:#d8f5ef}
.city-next-time{position:relative;margin-top:2px;font-size:clamp(66px,8vw,92px);line-height:.95;font-weight:850;letter-spacing:-.065em;color:#fff}
.city-countdown{position:relative;margin-top:13px;font-size:14px;font-weight:750;color:var(--gold)}
.city-next-source{position:absolute;left:34px;right:34px;bottom:28px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:17px;border-top:1px solid rgba(255,255,255,.10);font-size:12px;color:rgba(255,255,255,.66)}
.city-next-source b{color:#fff;font-size:12px}

.city-service-note{margin-top:22px;padding:15px 17px;border:1px solid #ead7a5;border-radius:16px;background:#fff8e7;color:#806424;font-size:13px;line-height:1.6}

.city-prayer-section{padding-top:58px}
.city-prayer-section .prayer-side h2{font-size:30px}
.city-prayer-section .prayer-side .date{font-size:13px}
.city-prayer-section .prayer-card.is-next{border-color:rgba(232,193,95,.75);background:#fff9e9;box-shadow:var(--shadow-card)}
.city-prayer-section .prayer-card.is-next:after{content:"";position:absolute;right:12px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--gold-strong)}
.city-prayer-section .prayer-card{position:relative}

.city-section{padding:84px 0}
.city-section.white{background:#fff}
.city-section.cream{background:var(--cream)}
.city-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:28px}
.city-section-head h2{margin:8px 0 0;font-size:clamp(32px,4vw,48px);line-height:1.05;letter-spacing:-.04em}
.city-section-head p{max-width:620px;margin:10px 0 0;color:var(--muted);line-height:1.7}
.city-source-chip{padding:8px 13px;border:1px solid #dfd4bb;border-radius:999px;background:#fffaf0;font-size:12px;font-weight:800;color:#8b681d;white-space:nowrap}

.city-table-shell{overflow:hidden;border:1px solid var(--outline);border-radius:28px;background:#fff;box-shadow:var(--shadow-card)}
.city-table-wrap{overflow-x:auto}
.city-calendar{width:100%;min-width:760px;border-collapse:collapse}
.city-calendar th,.city-calendar td{padding:16px 18px;border-bottom:1px solid #edf2f0;text-align:left;font-size:14px}
.city-calendar th{background:#f8faf8;font-size:11px;font-weight:850;letter-spacing:.10em;text-transform:uppercase;color:#82908b}
.city-calendar tbody tr:last-child td{border-bottom:0}
.city-calendar tbody tr.is-today{background:#fffaf0}
.city-calendar tbody tr:hover{background:#f9fcfa}
.city-calendar td:first-child{font-weight:750;color:#33443f}

.city-info-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:18px}
.city-info-card{padding:30px;border:1px solid var(--outline);border-radius:28px;background:#fff;box-shadow:var(--shadow-card)}
.city-info-card h2,.city-info-card h3{margin:14px 0 0;letter-spacing:-.035em}
.city-info-card h2{font-size:clamp(30px,3.7vw,44px);line-height:1.08}
.city-info-card h3{font-size:24px}
.city-info-card>p{margin:16px 0 0;color:var(--muted);line-height:1.75}
.city-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.city-fact{padding:16px;border:1px solid var(--outline);border-radius:18px;background:#fafcfb}
.city-fact small{display:block;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8b9792}
.city-fact strong{display:block;margin-top:6px;font-size:14px;color:#34413b;overflow-wrap:anywhere}
.city-authority{margin-top:18px;padding:18px;border:1px solid #dfd4bb;border-radius:20px;background:#fffaf0}
.city-authority small{display:block;font-size:10px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;color:#9a7a36}
.city-authority strong{display:block;margin-top:6px;font-size:18px;color:#765515}
.city-authority span{display:block;margin-top:5px;font-size:12px;color:#8b7b5f}
.city-qibla{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:radial-gradient(circle at 80% 5%,rgba(232,193,95,.16),transparent 30%),linear-gradient(145deg,#073b36,#075b52)}
.city-qibla:before{content:"";position:absolute;right:-90px;bottom:-100px;width:270px;height:270px;border:1px solid rgba(255,255,255,.09);border-radius:50%;box-shadow:0 0 0 34px rgba(255,255,255,.022),0 0 0 68px rgba(255,255,255,.014)}
.city-compass-stage{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;margin:0 0 20px}
.city-compass{position:relative;width:clamp(164px,17vw,188px);height:clamp(164px,17vw,188px);border:1px solid rgba(255,255,255,.20);border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.045) 0 5%,transparent 6% 35%,rgba(255,255,255,.025) 36% 52%,transparent 53%),rgba(255,255,255,.018);box-shadow:inset 0 0 0 11px rgba(255,255,255,.025),inset 0 0 0 34px rgba(255,255,255,.012),0 14px 34px rgba(0,22,20,.16)}
.city-compass:before{content:"";position:absolute;inset:8px;border-radius:50%;background:repeating-conic-gradient(from -1deg,rgba(255,255,255,.22) 0 1deg,transparent 1deg 14deg);-webkit-mask:radial-gradient(circle,transparent 0 70%,#000 71% 76%,transparent 77%);mask:radial-gradient(circle,transparent 0 70%,#000 71% 76%,transparent 77%);opacity:.52}
.city-compass:after{content:"";position:absolute;inset:31px;border:1px solid rgba(255,255,255,.09);border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.03)}
.city-compass-sweep{position:absolute;z-index:1;inset:13px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 302deg,rgba(118,216,199,.18) 330deg,rgba(118,216,199,.05) 352deg,transparent 360deg);opacity:0;pointer-events:none}
.city-compass-cardinal{position:absolute;z-index:3;font-size:10px;font-weight:900;letter-spacing:.08em;color:rgba(216,245,239,.55);line-height:1}
.city-compass-cardinal.is-n{top:15px;left:50%;transform:translateX(-50%);color:var(--gold)}
.city-compass-cardinal.is-e{right:16px;top:50%;transform:translateY(-50%)}
.city-compass-cardinal.is-s{bottom:15px;left:50%;transform:translateX(-50%)}
.city-compass-cardinal.is-w{left:16px;top:50%;transform:translateY(-50%)}
.city-compass-needle{position:absolute;z-index:4;left:50%;top:50%;width:5px;height:112px;margin:-56px 0 0 -2.5px;transform-origin:50% 50%;will-change:transform;filter:drop-shadow(0 3px 4px rgba(0,0,0,.18))}
.city-compass-needle:before{content:"";position:absolute;left:0;top:0;width:5px;height:58px;border-radius:6px 6px 2px 2px;background:linear-gradient(to top,#f0b83f,var(--gold));clip-path:polygon(50% 0,100% 12%,68% 100%,32% 100%,0 12%)}
.city-compass-needle:after{content:"";position:absolute;left:1px;bottom:1px;width:3px;height:53px;border-radius:0 0 6px 6px;background:linear-gradient(to bottom,rgba(216,245,239,.72),rgba(216,245,239,.10))}
.city-compass-hub{position:absolute;z-index:5;left:50%;top:50%;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;border:4px solid #0b6359;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(232,193,95,.16),0 3px 9px rgba(0,0,0,.20)}
.city-compass-status{display:flex;align-items:center;justify-content:center;gap:8px;min-height:20px;margin-top:10px;font-size:11px;font-weight:800;letter-spacing:.05em;color:rgba(216,245,239,.72);opacity:0;transform:translateY(-3px);transition:opacity .24s ease,transform .24s ease}
.city-compass-status i{font-size:10px;color:var(--gold)}
.city-compass-stage.is-searching .city-compass-status{opacity:1;transform:translateY(0)}
.city-compass-stage.is-searching .city-compass-sweep{opacity:1;animation:qibla-sweep 1s linear infinite}
.city-compass-stage.is-searching .city-compass{animation:qibla-breathe 1.45s ease-in-out infinite}
.city-compass-stage.is-ready .city-compass{box-shadow:inset 0 0 0 11px rgba(255,255,255,.025),inset 0 0 0 34px rgba(255,255,255,.012),0 14px 34px rgba(0,22,20,.16),0 0 0 1px rgba(232,193,95,.08)}
.city-qibla .city-kicker{position:relative;z-index:2;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:var(--mint)}
.city-qibla h3{position:relative;z-index:2;color:#fff}
.city-qibla .bearing{position:relative;z-index:2;display:block;margin-top:20px;font-size:34px;font-weight:850;color:var(--gold)}
.city-qibla p{position:relative;z-index:2;max-width:390px;color:rgba(255,255,255,.62)}
@keyframes qibla-sweep{to{transform:rotate(360deg)}}
@keyframes qibla-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.018)}}

.city-nearby-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.city-nearby-card{position:relative;padding:21px;border:1px solid var(--outline);border-radius:22px;background:#fff;box-shadow:var(--shadow-card);transition:.2s}
.city-nearby-card:hover{transform:translateY(-3px);border-color:rgba(10,109,97,.25);box-shadow:var(--shadow)}
.city-nearby-card small{display:block;color:#89958f;font-size:11px}
.city-nearby-card strong{display:block;margin-top:4px;padding-right:28px;font-size:17px}
.city-nearby-card i{position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--petrol)}

.city-download .download-card{padding-top:54px;padding-bottom:54px}
.city-download .download-inner p{max-width:650px}
.city-download .btn{color:var(--petrol-deep)}

.city-page .footer a[href^="/"]{color:rgba(255,255,255,.65)}
.city-location-footer{font-size:13px;line-height:1.7;color:rgba(255,255,255,.55)}
.city-location-footer b{display:block;margin-bottom:7px;color:var(--gold)}

[dir="rtl"] .city-calendar th,[dir="rtl"] .city-calendar td{text-align:right}
[dir="rtl"] .city-nearby-card strong{padding-right:0;padding-left:28px}
[dir="rtl"] .city-nearby-card i{right:auto;left:20px;transform:translateY(-50%) rotate(180deg)}

@media(max-width:1050px){
  .city-hero-grid{grid-template-columns:1fr;gap:34px}.city-next-card{max-width:680px}.city-info-grid{grid-template-columns:1fr}.city-nearby-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .city-hero{padding:48px 0 48px}.city-hero h1{font-size:44px}.city-lead{font-size:16px}.city-next-card{min-height:340px;padding:27px;border-radius:28px}.city-next-source{left:27px;right:27px;bottom:24px}.city-section{padding:66px 0}.city-section-head{align-items:flex-start;flex-direction:column}.city-info-card{padding:24px}.city-facts{grid-template-columns:1fr}.city-nearby-grid{grid-template-columns:1fr}.city-language-switch{display:none}
}
@media(max-width:420px){.city-hero h1{font-size:39px}.city-meta{display:grid}.city-meta-card{width:100%}.city-next-time{font-size:64px}}


@media (max-width:700px){
  .city-qibla{padding:28px 24px}
  .city-compass-stage{margin-bottom:18px}
  .city-compass{width:158px;height:158px}
  .city-compass-needle{height:94px;margin-top:-47px}
  .city-compass-needle:before{height:49px}
  .city-compass-needle:after{height:44px}
  .city-qibla .bearing{font-size:32px}
}
@media (prefers-reduced-motion:reduce){
  .city-compass-stage.is-searching .city-compass,.city-compass-stage.is-searching .city-compass-sweep{animation:none}
}
/* v2.0.25 — localized source accuracy note */
.city-prayer-section .prayer-source-accuracy{display:flex;align-items:flex-start;gap:8px;margin:14px 4px 0;padding-top:12px;border-top:1px solid var(--outline);font-size:11px;line-height:1.55;color:var(--muted)}
.city-prayer-section .prayer-source-accuracy i{flex:0 0 auto;margin-top:2px;color:var(--gold-strong)}
.city-prayer-section .prayer-source-accuracy span{min-width:0}



/* v2.0.27 — country prayer-time hubs */
.country-hero{padding-bottom:58px}
.country-hero .city-breadcrumbs{margin-bottom:28px}
.country-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:42px;align-items:center}
.country-summary-card{position:relative;overflow:hidden;display:flex;min-height:210px;flex-direction:column;align-items:flex-start;justify-content:center;padding:30px;border-radius:30px;color:#fff;background:radial-gradient(circle at 88% 12%,rgba(232,193,95,.22),transparent 34%),linear-gradient(145deg,#0a776a,#075b52 58%,#073b36);box-shadow:0 28px 70px rgba(0,28,25,.18)}
.country-summary-card:after{content:"";position:absolute;right:-60px;bottom:-75px;width:190px;height:190px;border:1px solid rgba(255,255,255,.09);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.02)}
.country-summary-card span{position:relative;z-index:1;font-size:72px;line-height:.9;font-weight:900;letter-spacing:-.06em;color:var(--gold)}
.country-summary-card strong{position:relative;z-index:1;margin-top:8px;font-size:22px;color:#fff}
.country-summary-card small{position:relative;z-index:1;margin-top:8px;font-size:12px;line-height:1.5;color:rgba(255,255,255,.65)}
.country-prayer-section{padding-top:66px}
.country-calendar{min-width:900px}
.country-calendar th:not(:first-child),.country-calendar td:not(:first-child){text-align:center;font-variant-numeric:tabular-nums}
.country-calendar td:not(:first-child){font-size:16px;font-weight:800;color:#173d37}
.country-city-cell{min-width:245px}
.country-city-cell a{display:inline-flex;align-items:center;gap:7px;font-size:16px;font-weight:850;color:var(--petrol-deep)}
.country-city-cell a:after{content:"↗";font-size:11px;color:var(--gold-strong)}
.country-city-cell small{display:block;margin-top:5px;font-size:10px;font-weight:600;line-height:1.45;color:#8a9691}
.country-service-note{margin-top:18px}
[dir="rtl"] .country-calendar th:not(:first-child),[dir="rtl"] .country-calendar td:not(:first-child){text-align:center}
@media(max-width:800px){.country-hero-grid{grid-template-columns:1fr}.country-summary-card{min-height:170px;max-width:420px}.country-summary-card span{font-size:62px}}