/* Feature pages (Ramadan, calendars, Qibla, mosques, Islamic calendar, duas, zakat, articles). Loaded only by those pages. */
.feat .page-head .lead a{font-weight:700}
.f-actions{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.f-note{color:var(--muted);font-size:.9rem}
.f-table th,.f-table td{padding:6px 8px}
.f-table tbody th a{font-weight:700}
.f-table td.hl{font-weight:800;color:var(--green-800)}
.f-table tr.fri{background:#F2F8F5!important}
.f-table tr.l10 th{color:var(--gold-700)}
.f-table tr.cond{color:var(--muted);font-style:italic}
.f-table tr.ev{background:var(--gold-100)!important;font-weight:700}
.f-months{position:sticky;top:0;z-index:5;background:var(--cream);display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--line)}
.f-months ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 10px;flex:1}
.f-months a{font-weight:700;text-decoration:none}
.f-month h2{scroll-margin-top:70px}
.f-more{background:var(--green-100);border-radius:var(--radius);padding:14px 18px;margin:24px 0}
.f-more h2{margin-top:0;font-size:1.15rem}
.f-more ul{margin:0;padding-inline-start:20px;columns:2 260px}
.f-qibla-top{margin:12px 0 18px}
.f-tool{max-width:760px}
.f-form fieldset{border:1px solid var(--line);border-radius:10px;padding:10px 14px;display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.f-form legend{font-weight:700;color:var(--green-800);padding:0 6px}
.f-form label{display:flex;flex-direction:column;font-size:.92rem;gap:4px;min-width:150px;flex:1}
.f-form input,.f-form select{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);min-width:0}
.f-form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;width:100%}
.f-out{background:var(--gold-100);border-radius:10px;padding:12px 16px;margin-top:14px}
.f-out strong{font-size:1.35rem;color:var(--green-800)}
.f-qibla-out{text-align:center}
.f-dial svg{transition:transform .2s ease}
.f-dial [data-q=needle]{transform-origin:100px 100px;transition:transform .3s ease}
.f-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin:14px 0}
.f-grid .card{margin:0}
.f-cal{width:100%;border-collapse:collapse;font-size:.85rem;text-align:center;font-variant-numeric:tabular-nums}
.f-cal caption{font-weight:800;color:var(--green-800);padding:4px 0 6px;font-size:1rem}
.f-cal th{color:var(--muted);font-weight:700;font-size:.75rem;padding:2px}
.f-cal td{padding:3px 2px;border-radius:6px}
.f-cal td small{display:block;color:var(--muted);font-size:.68rem;line-height:1.1}
.f-cal td.ev{background:var(--gold-100);font-weight:800}
.f-cal td.fri{color:var(--green-600);font-weight:700}
.f-today{font-size:1.25rem}
.f-today strong{display:block;font-size:1.7rem;color:var(--green-800)}
.dua{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin:16px 0;box-shadow:var(--shadow)}
.dua h3{margin:0 0 8px;font-size:1.08rem}
.dua .ar{font-family:"Tajawal","Amiri","Traditional Arabic","Scheherazade New",serif;font-size:1.45rem;line-height:2.1;direction:rtl;text-align:right;color:var(--green-900);margin:0 0 10px}
.dua .tr{font-style:italic;color:var(--muted);margin:0 0 8px}
.dua .src{font-size:.86rem;color:var(--muted);margin:8px 0 0;border-top:1px dashed var(--line);padding-top:6px}
.dua .rep{display:inline-block;background:var(--gold-100);color:var(--gold-700);font-weight:800;border-radius:999px;padding:0 10px;font-size:.85rem;margin-inline-start:6px}
.article-body{max-width:820px}
.article-body h2{margin-top:1.4em}
.article-body ol li,.article-body ul li{margin-bottom:.4em}
.article-body .note{background:var(--green-100);border-radius:10px;padding:10px 14px}
.toc{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 16px;margin:12px 0;max-width:820px}
.toc ol{margin:4px 0;padding-inline-start:20px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;list-style:none;padding:0;margin:14px 0}
.cards a{display:block;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 14px;text-decoration:none;color:var(--ink);height:100%}
.cards a:hover{border-color:var(--gold-500)}
.cards strong{display:block;color:var(--green-800);margin-bottom:4px}
.cards span{font-size:.9rem;color:var(--muted)}
.mosque-list{list-style:none;padding:0;margin:10px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.mosque-list li{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.mosque-list strong{display:block;color:var(--green-800)}
.mosque-list small{display:block;color:var(--muted)}
@media print{
  .f-months,.f-actions,.f-more,.faq,.f-tool button{display:none!important}
  .f-month{break-inside:avoid-page;page-break-after:always}
  .f-table th,.f-table td{padding:2px 4px;font-size:10pt}
}