/* My Zakat Tool: calculator and widgets. Scoped under .myzt so the theme is not affected. */
.myzt{--z-bg:#f7faf9;--z-card:#fff;--z-ink:#14302b;--z-mute:#556a65;--z-line:#dfe9e6;--z-field:#6b8a83;--z-teal:#0f766e;--z-tealbg:#0f766e;--z-teal2:#e6f4f1;--z-acc:#0b5d56;--z-warn:#fbf7ee;--z-ok:#1e7a3c;--z-okbg:#e7f6ec;
	font-family:inherit;color:var(--z-ink);font-size:15px;line-height:1.5;margin:0 0 24px;box-sizing:border-box}
.myzt *,.myzt *::before,.myzt *::after{box-sizing:border-box}
.myzt button{font:inherit;cursor:pointer}
.myzt input,.myzt select{font:inherit;color:var(--z-ink)}
.myzt-calc{min-height:760px}
.myzt.alignwide{max-width:var(--wp--style--global--wide-size,1200px);margin-left:auto;margin-right:auto;width:100%}
.myzt-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:20px;align-items:start}
.myzt-card{background:var(--z-card);border:1px solid var(--z-line);border-radius:14px;padding:20px}
.myzt-ctx{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--z-teal2);border-radius:10px;padding:10px 14px;font-size:14px;flex-wrap:wrap}
.myzt-ctx b{color:var(--z-acc)}
.myzt-link{background:none;border:0;color:var(--z-teal);font-weight:600;padding:0;text-decoration:underline;text-underline-offset:2px}
.myzt-ctxform{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.myzt-ctxform label{font-size:12.5px;color:var(--z-mute);display:block}
.myzt-sel,.myzt-inp{width:100%;border:1.5px solid var(--z-field);border-radius:9px;padding:10px 12px;font-size:16px;background:var(--z-card);min-height:44px}
/* .myzt input (0,1,1) above sets font:inherit (15px); 16px keeps iOS from zooming on focus (FIX-112). */
.myzt .myzt-inp,.myzt .myzt-sel{font-size:16px}
.myzt-inp:focus,.myzt-sel:focus{outline:2px solid var(--z-teal);outline-offset:1px;border-color:var(--z-teal)}
.myzt-rates{display:flex;gap:6px 18px;font-size:13px;color:var(--z-mute);margin:12px 0 4px;flex-wrap:wrap}
.myzt-rates strong{color:var(--z-ink)}
.myzt-own{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.myzt-quick{display:flex;gap:8px;margin:12px 0 16px}
.myzt-quick .myzt-inp{border-style:dashed}
.myzt-btn{border:1.5px solid var(--z-field);background:var(--z-card);border-radius:9px;padding:9px 12px;font-size:14px;font-weight:600;color:var(--z-ink);min-height:44px}
.myzt-btn:hover{border-color:var(--z-teal)}
.myzt-btn.p{background:var(--z-tealbg);border-color:var(--z-tealbg);color:#fff}
.myzt-q{font-weight:700;margin:4px 0 10px}
.myzt-q small{font-weight:400;color:var(--z-mute)}
.myzt-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:8px}
.myzt-tile{border:1.5px solid var(--z-line);border-radius:10px;padding:10px 4px;overflow-wrap:break-word;line-height:1.25;text-align:center;font-size:12.5px;color:var(--z-mute);background:var(--z-card);min-height:64px}
.myzt-tile .ic{font-size:19px;display:block;margin-bottom:2px;line-height:1.2}
.myzt-tile[aria-pressed="true"]{border-color:var(--z-teal);background:var(--z-teal2);color:var(--z-acc);font-weight:600}
.myzt-sec{border-top:1px solid var(--z-line);padding:12px 0 4px}
.myzt-sec h4,.myzt .myzt-h{margin:0 0 6px;padding:0;font-size:14px;line-height:1.4;font-weight:700;letter-spacing:0;text-transform:none;color:var(--z-acc)}
.myzt-field{padding:6px 0}
.myzt-field>label{font-weight:600;font-size:14px;display:flex;justify-content:space-between;gap:8px}
.myzt-help{color:var(--z-mute);font-weight:400;font-size:12.5px}
.myzt-row{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.myzt-row .myzt-inp{flex:1 1 120px}
.myzt-seg{display:inline-flex;border:1.5px solid var(--z-field);border-radius:9px;overflow:hidden;font-size:13px}
.myzt-seg button{border:0;background:var(--z-card);padding:10px 11px;color:var(--z-ink);min-height:44px}
.myzt-seg button[aria-pressed="true"]{background:var(--z-tealbg);color:#fff}
@media (max-width:520px){.myzt-seg6{display:grid;grid-template-columns:repeat(3,1fr)}}
.myzt-people{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 4px;align-items:center}
.myzt-person{border:1.5px solid var(--z-line);background:var(--z-card);border-radius:20px;padding:6px 12px;font-size:13px}
.myzt-person[aria-pressed="true"]{border-color:var(--z-teal);background:var(--z-teal2);color:var(--z-acc);font-weight:600}
.myzt-res{position:sticky;top:16px}
.myzt-due{font-size:13px;color:var(--z-mute)}
.myzt-amt{font-size:38px;font-weight:800;color:var(--z-teal);letter-spacing:-.5px;margin:2px 0;line-height:1.15;word-break:break-word}
.myzt-badge{display:inline-block;background:var(--z-okbg);color:var(--z-ok);font-size:12.5px;padding:3px 10px;border-radius:20px;margin-bottom:12px}
.myzt-badge.no{background:var(--z-bg);color:var(--z-mute)}
.myzt-line{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:7px 0;border-bottom:1px dashed var(--z-line)}
.myzt-line.off span:last-child{text-decoration:line-through;color:var(--z-mute)}
.myzt-why{font-size:12px;margin:-12px 0 -12px 6px;display:inline-flex;align-items:center;min-height:44px;min-width:44px;justify-content:center;vertical-align:middle}
.myzt-whytxt{font-size:12.5px;color:var(--z-mute);background:var(--z-bg);border-radius:8px;padding:8px 10px;margin:4px 0}
.myzt-note{font-size:12.5px;background:var(--z-warn);border-radius:8px;padding:8px 10px;margin-top:8px}
.myzt-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.myzt-btns .wide{grid-column:1/3}
.myzt-disc{font-size:12px;color:var(--z-mute);margin-top:12px;background:var(--z-warn);border-radius:8px;padding:8px 10px}
.myzt-table{width:100%;border-collapse:collapse;font-size:14px}
.myzt-table th,.myzt-table td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--z-line);vertical-align:top}
.myzt-table th{font-size:12.5px;color:var(--z-mute);font-weight:600}
.myzt-table tr.sel{background:var(--z-teal2)}
.myzt-table td.z{font-weight:700;white-space:nowrap}
/* Tables wider than the screen scroll sideways; a soft shadow on the cut edge shows there is more (FIX-224). */
.myzt-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;background:linear-gradient(to right,var(--z-card) 30%,rgba(255,255,255,0)) left center/32px 100% no-repeat local,linear-gradient(to left,var(--z-card) 30%,rgba(255,255,255,0)) right center/32px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.2),rgba(0,0,0,0)) left center/12px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.2),rgba(0,0,0,0)) right center/12px 100% no-repeat scroll}
.myzt-cmp{margin-top:20px}
.myzt-cmp-h{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.myzt-trust{display:flex;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--z-acc);margin:0 0 14px;padding:0;list-style:none}
.myzt-trust li{background:var(--z-teal2);padding:4px 10px;border-radius:20px;margin:0}
.myzt-pdfname{display:flex;gap:8px;margin-top:10px}
.myzt-sticky{display:none}
.myzt-small{font-size:12.5px;color:var(--z-mute)}
.myzt-mini{max-width:640px}
.myzt-faq details{background:var(--z-card);border:1px solid var(--z-line);border-radius:10px;padding:12px 14px;margin-bottom:8px}
.myzt-faq summary{font-weight:600;cursor:pointer}
.myzt-faq details p{margin:8px 0 0}
.myzt-author{display:flex;gap:12px;align-items:center;background:var(--z-card);border:1px solid var(--z-line);border-radius:10px;padding:12px 14px;font-size:13.5px;margin:20px 0}
.myzt-author .av{flex:0 0 44px;height:44px;border-radius:50%;background:var(--z-tealbg);color:#fff;display:grid;place-items:center;font-weight:700}
.myzt-answer{background:var(--z-card);border-left:4px solid var(--z-teal);border-radius:10px;padding:14px 16px;margin:16px 0;border-top:1px solid var(--z-line);border-right:1px solid var(--z-line);border-bottom:1px solid var(--z-line)}
.myzt-answer .k{font-size:12px;color:var(--z-teal);font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.myzt-related{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 24px}
.myzt-related a{background:var(--z-card);border:1px solid var(--z-line);border-radius:10px;padding:12px;font-size:14px;font-weight:600;text-decoration:none;color:var(--z-ink)}
.myzt-related a small{display:block;color:var(--z-mute);font-weight:400;font-size:13px;line-height:1.4;margin-top:2px}
.myzt-related a:hover{border-color:var(--z-teal)}
/* Ad slots: fixed height so nothing shifts; no border, label or colour, so an unfilled slot is just empty space. */
.myzt-ad{display:block;width:100%;margin:24px 0;overflow:hidden;text-align:center;clear:both}
.myzt-ad ins{display:block}
.myzt-ad-calc{min-height:280px}
.myzt-ad-article{min-height:280px}
.myzt-ad-sidebar{min-height:600px}
.myzt-ad-label{display:block;font-size:10px;line-height:14px;height:14px;color:#5d6d69;letter-spacing:.5px;text-transform:uppercase}
/* Urdu widgets (FIX-055). The old stack ended in "inherit", which made the whole rule invalid. */
.myzt:lang(ur),[dir="rtl"] .myzt,.myzt[dir="rtl"]{font-family:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Urdu Typesetting","Noto Naskh Arabic",Tahoma,sans-serif;line-height:1.9}
@media (max-width:760px){
	.myzt-grid{grid-template-columns:1fr}
	.myzt-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
	.myzt-ctxform{grid-template-columns:1fr}
	.myzt-res{position:static}
	.myzt-card{padding:14px}
	.myzt-calc{min-height:1100px}
	.myzt-related{grid-template-columns:1fr 1fr}
	.myzt-ad-sidebar{display:none}
	.myzt-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--z-tealbg);color:#fff;padding:12px 18px;justify-content:space-between;align-items:center;font-size:14px;box-shadow:0 -4px 14px rgba(0,0,0,.15)}
	.myzt-sticky b{font-size:20px}
	.myzt-sticky[hidden]{display:none}
	body.myzt-has-sticky{padding-bottom:60px}
}
@media print{.myzt-sticky,.myzt-btns,.myzt-quick,.myzt-ad{display:none!important}}
/* Reserve space for widgets until app.js has built them, so the content below does not jump (CLS).
   Heights measured on the live pages (25 Oct 2026, v1.19.1) at 375 px and 1366 px; Urdu pages are taller. */
.myzt[data-widget="calculator"]:not([data-ready]){min-height:1300px}
.myzt[data-widget="fitrana"]:not([data-ready]){min-height:670px}
.myzt[data-widget="fitrana"]:lang(ur):not([data-ready]){min-height:729px}
.myzt[data-widget="iddat"]:not([data-ready]){min-height:535px}
.myzt[data-widget="iddat"]:lang(ur):not([data-ready]){min-height:557px}
.myzt[data-widget="qurbani"]:not([data-ready]){min-height:1795px}
.myzt[data-widget="khums"]:not([data-ready]){min-height:950px}
.myzt[data-widget="fidya"]:not([data-ready]){min-height:735px}
.myzt[data-widget="hawl"]:not([data-ready]){min-height:510px}
.myzt[data-widget="ushr"]:not([data-ready]){min-height:725px}
[data-myzt-embed]:empty{min-height:203px}
@media (min-width:782px){
.myzt[data-widget="calculator"]:not([data-ready]){min-height:580px}
.myzt[data-widget="fitrana"]:not([data-ready]){min-height:558px}
.myzt[data-widget="fitrana"]:lang(ur):not([data-ready]){min-height:623px}
.myzt[data-widget="iddat"]:not([data-ready]){min-height:433px}
.myzt[data-widget="iddat"]:lang(ur):not([data-ready]){min-height:477px}
.myzt[data-widget="qurbani"]:not([data-ready]){min-height:1410px}
.myzt[data-widget="qurbani"]:lang(ur):not([data-ready]){min-height:1496px}
.myzt[data-widget="khums"]:not([data-ready]){min-height:840px}
.myzt[data-widget="fidya"]:not([data-ready]){min-height:650px}
.myzt[data-widget="hawl"]:not([data-ready]){min-height:450px}
.myzt[data-widget="ushr"]:not([data-ready]){min-height:610px}
}
.wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* Keyboard focus ring inside segmented buttons (the group clips outlines with overflow:hidden). */
.myzt-seg button:focus-visible{outline:2px solid var(--z-acc);outline-offset:-3px;box-shadow:inset 0 0 0 4px #fff}
.myzt-seg button[aria-pressed="true"]:focus-visible{outline-color:#fff;box-shadow:inset 0 0 0 4px var(--z-tealbg)}
/* At least a 24x24 px hit area for the language toggle and the Change link. */
.myzt-ctx .myzt-link{display:inline-block;min-width:24px;min-height:24px;padding:4px 6px;line-height:16px}
.myzt-err{font-size:12.5px;color:#b42318;margin-top:4px}
.myzt-inp[aria-invalid="true"]{border-color:#b42318;box-shadow:0 0 0 1px #b42318}
/* Urdu pages (FIX-046): right-to-left text in the content box only; widgets set their own direction. */
.myzt-ur{direction:rtl;text-align:right}
.myzt-ur>p,.myzt-ur>ul,.myzt-ur>ol,.myzt-ur>h2,.myzt-ur>h3,.myzt-ur>figure{font-family:"Noto Nastaliq Urdu","Jameel Noori Nastaleeq","Urdu Typesetting","Noto Naskh Arabic",Tahoma,sans-serif;line-height:2.1}
.myzt-ur>ul,.myzt-ur>ol{margin:0 1.6em 1.5em 0;padding:0}
.myzt-ur th,.myzt-ur td{text-align:right}
/* Phase 7 (accessibility): links in tables on the light teal row reach 4.5:1 (FIX-052); */
.myzt-table a{color:var(--z-acc)}
/* a 24 px checkbox instead of the browser's 13 px (FIX-053, FIX-210); */
.myzt input[type="checkbox"]{width:24px;height:24px;flex:0 0 24px;margin:0 6px 0 0;vertical-align:middle;accent-color:var(--z-teal)}
.myzt[dir="rtl"] input[type="checkbox"]{margin:0 0 0 6px}
/* the screen-reader-only live region for the calculator total (FIX-054). */
.myzt-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Inheritance calculator (wirasat): its own page in a frame; the frame takes the height the page reports. */
.myzt-wirasat-frame{display:block;width:100%;height:1600px;border:0;background:transparent}
/* Urdu pages (FIX-113): the article (heading, breadcrumb, text) reads right to left; the theme's header, menu and sidebar stay as on
   the English pages. The theme pulls .alignwide out with a negative left margin, which a right-to-left box ignores, so mirror it. */
html[lang=ur] .inside-article{direction:rtl}
html[lang=ur] .entry-content .myzt.alignwide{margin-left:0;margin-right:-40px}
@media (max-width:768px){html[lang=ur] .entry-content .myzt.alignwide{margin-right:-30px}}
html[lang=ur] .full-width-content .entry-content .myzt.alignwide{margin-right:0}
/* Phase 5 (accessibility, 18 Oct audit). Form field borders reach 3:1 (FIX-116): --z-field; the teal behind white text is
   --z-tealbg and stays dark in dark mode, while --z-teal (text, outlines) is lighter there (FIX-118). Small labels and links get a
   44 px tap area (FIX-117). */
.myzt .myzt-check{display:flex;align-items:center;min-height:44px;margin:0;cursor:pointer}
.myzt-people .myzt-add{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
.myzt-pdfrow{background:none;margin:8px 0 16px}
.myzt-ask b{display:block;margin-bottom:6px}
/* Phase 4 (UX, 25 Oct audit). On phones the madhab comparison is one card per madhab, the zakat amount right under the
   madhab name, so nothing is cut at "Rs 73..." (FIX-224). */
@media (max-width:480px){
	.myzt-cmp .myzt-scroll{overflow:visible;background:none}
	.myzt-cmp .myzt-table thead{display:none}
	.myzt-cmp .myzt-table,.myzt-cmp .myzt-table tbody{display:block}
	.myzt-cmp .myzt-table tr{display:flex;flex-direction:column;border:1px solid var(--z-line);border-radius:10px;padding:6px 12px;margin:8px 0}
	.myzt-cmp .myzt-table td{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed var(--z-line);text-align:end}
	.myzt-cmp .myzt-table td:last-child{border-bottom:0}
	.myzt-cmp .myzt-table td::before{content:attr(data-l);color:var(--z-mute);font-size:12.5px;font-weight:400;text-align:start}
	.myzt-cmp .myzt-table td.m{order:-2;justify-content:flex-start;font-weight:700;color:var(--z-acc)}
	.myzt-cmp .myzt-table td.m::before{content:none}
	.myzt-cmp .myzt-table td.z{order:-1;white-space:normal;font-size:16px}
}