/* Internal CMS page skins — Design look (cream/teal). Does not alter main.css tokens. */

/* ── Shared tool panels (zakat / kaffarah) ───────────────────────── */
.tool-info{
  display:flex;gap:14px;align-items:flex-start;
  background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:18px 20px;margin-bottom:22px;
  box-shadow:0 10px 28px rgba(13,47,58,.04);
}
.tool-info .ico{
  width:46px;height:46px;border-radius:14px;flex-shrink:0;
  background:rgba(11,131,128,.1);color:var(--teal);
  display:grid;place-items:center;font-size:1.25rem;
}
.tool-info h3{margin:0 0 6px;font-size:16px;color:var(--ink)}
.tool-info p{margin:0;color:var(--muted);font-size:14px;line-height:1.75}

.tool-panel{
  background:#fff;border:1px solid var(--line);border-radius:24px;
  overflow:hidden;box-shadow:0 16px 40px rgba(13,47,58,.06);
}
.tool-panel__head{
  padding:18px 26px;
  background:linear-gradient(135deg,var(--teal),var(--blue));
  color:#fff;
}
.tool-panel__head h2{
  margin:0;font-size:20px;font-weight:700;
  display:flex;align-items:center;gap:10px;color:#fff;
}
.tool-panel__body{padding:26px}
.tool-panel__foot{
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,#eef6f6,#fff);
  padding:26px;text-align:center;
}
.tool-panel__foot.is-hidden,
.tool-panel__foot.hidden{display:none}

.tool-toolbar{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px;margin-bottom:18px;
  background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:16px 18px;box-shadow:0 10px 28px rgba(13,47,58,.04);
}
.tool-toolbar__label{
  display:flex;align-items:center;gap:8px;
  font-weight:700;color:var(--ink);font-size:15px;
}
.tool-toolbar__label .ico{color:var(--teal);font-size:1.2rem}
.tool-toolbar__meta{
  display:flex;flex-wrap:wrap;gap:12px 18px;
  margin-top:10px;font-size:12px;color:var(--muted);width:100%;
}
.tool-toolbar__meta .is-loading{color:var(--blue);display:inline-flex;align-items:center;gap:6px}
.tool-toolbar__meta .is-warn{color:#b45309}
/* Beat .is-loading { display:inline-flex } so the spinner can actually hide */
.tool-toolbar__meta .hidden{display:none!important}

.tool-select-wrap{position:relative;width:100%;max-width:280px}
.tool-select{
  width:100%;appearance:none;
  padding:12px 40px 12px 14px;
  border:1px solid var(--line);border-radius:12px;
  background:#f7fbfb;color:var(--ink);font:inherit;font-weight:600;cursor:pointer;
}
[dir="rtl"] .tool-select{padding:12px 14px 12px 40px}
.tool-select:focus{
  outline:none;border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(11,131,128,.12);background:#fff;
}
.tool-select-wrap .tool-select-icon{
  position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);
  color:var(--muted);pointer-events:none;font-size:.875rem;
}

.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tool-field{margin:0}
.tool-field.full{grid-column:1/-1}
.tool-field label{
  display:flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;color:var(--ink-2);margin-bottom:8px;
}
.tool-field label .ico{color:var(--teal)}
.tool-input-wrap{position:relative;display:flex;align-items:center}
.tool-input{
  width:100%;padding:12px 48px 12px 14px;
  border:1px solid var(--line);border-radius:12px;
  background:#f7fbfb;color:var(--ink);font:inherit;font-weight:600;
  -moz-appearance:textfield;
}
[dir="rtl"] .tool-input{padding:12px 14px 12px 48px}
.tool-input::-webkit-outer-spin-button,
.tool-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.tool-input:focus{
  outline:none;border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(11,131,128,.12);background:#fff;
}
.tool-suffix{
  position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);
  font-size:12px;font-weight:700;color:var(--muted);pointer-events:none;
}
.tool-hint{margin:6px 0 0;font-size:12px;color:var(--muted)}
.tool-actions{margin-top:22px}
.tool-actions .btn{min-width:200px}
.tool-actions .btn:disabled{opacity:.55;cursor:not-allowed}

.tool-status{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:999px;font-size:13px;font-weight:700;margin-bottom:12px;
}
.tool-status--ok{background:rgba(11,131,128,.12);color:var(--teal)}
.tool-status--warn{background:#fff7ed;color:#b45309}
.tool-status--info{background:rgba(26,109,153,.1);color:var(--blue)}
.tool-result-label{margin:0 0 4px;font-size:13px;color:var(--muted)}
.tool-result-value{margin:0;font-size:28px;font-weight:800;color:var(--ink)}
.tool-result-value--lg{font-size:40px;color:var(--teal);letter-spacing:-.02em}
.tool-result-block{margin:16px 0}
.tool-result-cta{margin-top:18px}
.tool-result-muted{color:var(--muted);font-size:16px;margin:0}
.tool-result-muted small{display:block;margin-top:8px;font-size:13px;color:#8a9aa2}

.tool-nisab-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;
}
.tool-nisab-card{
  display:flex;align-items:center;gap:12px;
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px;
}
.tool-nisab-card .ico-wrap{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;background:rgba(11,131,128,.1);color:var(--teal);
}
.tool-nisab-card--gold .ico-wrap{background:#fef9c3;color:#ca8a04}
.tool-nisab-card--silver .ico-wrap{background:#f1f5f9;color:#64748b}
.tool-nisab-card .eyebrow{margin:0;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.tool-nisab-card .value{margin:2px 0 0;font-size:14px;font-weight:700;color:var(--ink)}

.tool-spinner{
  display:inline-block;width:.875rem;height:.875rem;
  border:2px solid var(--line);border-top-color:var(--teal);
  border-radius:50%;animation:tool-spin .7s linear infinite;
}
@keyframes tool-spin{to{transform:rotate(360deg)}}

/* Kaffarah type cards */
.kaffarah-type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kaffarah-type-card{position:relative;cursor:pointer}
.kaffarah-radio{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
.kaffarah-type-content{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:18px 12px;border:1.5px solid var(--line);border-radius:16px;
  text-align:center;transition:.2s;background:#f7fbfb;
}
.kaffarah-type-content:hover{border-color:rgba(11,131,128,.35);background:#fff}
.kaffarah-radio:checked + .kaffarah-type-content{
  border-color:var(--teal);background:#fff;
  box-shadow:0 0 0 3px rgba(11,131,128,.12);
}
.kaffarah-type-content .ico{font-size:1.5rem;color:var(--teal)}
.kaffarah-type-label{font-size:14px;font-weight:700;color:var(--ink)}
.kaffarah-type-desc{font-size:12px;color:var(--muted)}
.kaffarah-stepper{display:flex;align-items:center;gap:10px;max-width:220px}
.kaffarah-stepper button{
  width:44px;height:44px;border-radius:12px;border:1px solid var(--line);
  background:#f7fbfb;color:var(--ink);font-size:1.15rem;font-weight:700;cursor:pointer;
}
.kaffarah-stepper button:hover{border-color:var(--teal);color:var(--teal);background:#fff}
.kaffarah-days-input{
  width:5rem;padding:12px;border:1px solid var(--line);border-radius:12px;
  font-size:1.2rem;font-weight:700;color:var(--ink);background:#f7fbfb;
  text-align:center;-moz-appearance:textfield;
}
.kaffarah-days-input::-webkit-outer-spin-button,
.kaffarah-days-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.kaffarah-days-input:focus{
  outline:none;border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(11,131,128,.12);background:#fff;
}
.kaffarah-meal-ref{
  display:flex;align-items:center;gap:12px;
  background:#f3f8f8;border:1px solid var(--line);border-radius:14px;padding:14px 16px;
}
.kaffarah-meal-ref .ico-wrap{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;background:rgba(11,131,128,.12);color:var(--teal);
}
.kaffarah-meal-ref p{margin:0;font-size:14px;color:var(--muted)}
.kaffarah-meal-ref strong{color:var(--teal)}

/* ── Static / CMS body shells ────────────────────────────────────── */
.cms-content-shell{
  background:#fff;border:1px solid var(--line);border-radius:24px;
  padding:28px 30px;box-shadow:0 16px 40px rgba(13,47,58,.05);
  color:var(--ink);line-height:1.85;max-width:820px;margin:0 auto;
}
.cms-content-shell.cms-content-shell--wide{max-width:none}
.cms-content-shell h2{font-size:28px;margin:1.35em 0 .45em;color:var(--ink)}
.cms-content-shell h3{font-size:20px;margin:1.2em 0 .4em;color:var(--ink-2)}
.cms-content-shell p{color:var(--muted);margin:0 0 12px}
.cms-content-shell a{color:var(--teal);font-weight:600}
.cms-content-shell ul,.cms-content-shell ol{margin:0 0 14px;padding-inline-start:1.25rem;color:var(--muted)}
.cms-content-shell img{max-width:100%;height:auto;border-radius:18px}
.legal-page-shell{
  background:#fff;border:1px solid var(--line);border-radius:24px;
  padding:28px 30px;box-shadow:0 16px 40px rgba(13,47,58,.05);
  max-width:820px;margin:0 auto;
}
.about-page-content{
  background:#fff;border:1px solid var(--line);border-radius:24px;
  padding:28px 30px;box-shadow:0 16px 40px rgba(13,47,58,.05);
}

/* ── About page: artistic reading layout ─────────────────────────── */
.page-hero--about{
  background:
    radial-gradient(ellipse 70% 80% at 100% 0%, rgba(11,131,128,.16), transparent 55%),
    radial-gradient(ellipse 50% 60% at 0% 100%, rgba(26,109,153,.08), transparent 50%),
    linear-gradient(165deg,#e7f3f3 0%,#f7fbfb 55%,#eef6f8 100%);
}
.page-hero--about .container{position:relative;z-index:1}
.page-hero--about .eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--teal);font-weight:700;letter-spacing:.08em;font-size:12px;
  text-transform:uppercase;
}
.page-hero--about .eyebrow:before,
.page-hero--about .eyebrow:after{
  content:"";display:inline-block;width:28px;height:1px;
  background:linear-gradient(90deg,transparent,var(--teal),transparent);
}
.page-hero--about h1{
  max-width:18ch;
  font-size:clamp(32px,4.6vw,56px);
  line-height:1.18;
  color:var(--ink);
}
.page-hero--about p{
  max-width:42rem;
  font-size:clamp(16px,1.35vw,20px);
  line-height:1.85;
  color:var(--ink-2);
}
.page-section.static-page-section,
.page-section.about-page{
  padding:28px 0 96px;
  background:
    linear-gradient(180deg,rgba(243,248,248,.65),#f7fbfb 18%);
}
.page-section.static-page-section .container,
.page-section.about-page .container{position:relative}
.page-section.about-page .container:before{
  content:"";position:absolute;inset:0 auto 0 50%;
  width:1px;margin-inline-start:-.5px;
  background:linear-gradient(180deg,transparent,rgba(11,131,128,.18),transparent);
  pointer-events:none;
}

.about-stage,
.static-page-stage{
  position:relative;z-index:1;
  max-width:780px;margin:0 auto;
}
.about-stage--with-media,
.static-page-stage--with-media{
  max-width:1080px;
  display:grid;
  grid-template-columns:minmax(220px,.78fr) minmax(0,1.22fr);
  gap:clamp(28px,4vw,56px);
  align-items:start;
}
.static-page-stage--wide{max-width:none}
.about-portrait,
.static-page-portrait{margin:0;position:sticky;top:112px}
.about-portrait__frame,
.static-page-portrait__frame{
  position:relative;border-radius:28px;overflow:hidden;
  box-shadow:0 28px 60px rgba(13,47,58,.12);
  border:1px solid rgba(11,131,128,.18);
}
.about-portrait__frame:after,
.static-page-portrait__frame:after{
  content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.45);
  border-radius:18px;pointer-events:none;
}
.about-portrait img,
.static-page-portrait img{width:100%;height:100%;min-height:320px;object-fit:cover;filter:saturate(.92)}
.about-portrait figcaption,
.static-page-portrait figcaption{
  margin-top:12px;font-size:12px;font-weight:700;color:var(--teal);
  letter-spacing:.06em;
}

.about-article,
.static-page-article{
  position:relative;
  background:
    linear-gradient(180deg,rgba(11,131,128,.07),transparent 28px),
    #fff;
  border:1px solid var(--line);
  border-radius:32px;
  padding:clamp(28px,4.5vw,56px) clamp(22px,4vw,64px) clamp(36px,5vw,72px);
  box-shadow:0 24px 64px rgba(13,47,58,.06);
  color:var(--ink);
  max-width:none;
}
.about-article__mark,
.static-page-article__mark{
  width:56px;height:4px;border-radius:99px;margin:0 0 28px;
  background:linear-gradient(90deg,var(--teal),var(--cyan));
}
.about-article > *:last-child,
.static-page-article > *:last-child{margin-bottom:0}

.about-article h1,
.about-article h2,
.about-article h3,
.about-article h4,
.static-page-article h1,
.static-page-article h2,
.static-page-article h3,
.static-page-article h4{
  color:var(--ink);
  font-family:'Thmanyah Serif Display',serif;
  font-weight:700;
  letter-spacing:-.02em;
  line-height:1.28;
  text-wrap:balance;
}
.about-article h2,
.static-page-article h2{
  font-size:clamp(26px,2.4vw,34px);
  margin:2.4em 0 .55em;
  padding-top:.85em;
  border-top:1px solid rgba(11,131,128,.16);
  position:relative;
}
.about-article h2:first-child,
.about-article h2:first-of-type:first-child,
.static-page-article h2:first-child,
.static-page-article h2:first-of-type:first-child{border-top:0;padding-top:0;margin-top:0}
.about-article h2:before,
.static-page-article h2:before{
  content:"";position:absolute;top:-1px;inset-inline-start:0;
  width:72px;height:2px;background:var(--teal);border-radius:99px;
}
.about-article h3,
.static-page-article h3{
  font-size:clamp(18px,1.6vw,22px);
  margin:1.8em 0 .45em;
  color:var(--ink-2);
  font-family:'Thmanyah Sans',sans-serif;
  font-weight:800;
}
.about-article h4,
.static-page-article h4{
  font-size:17px;margin:1.5em 0 .35em;
  font-family:'Thmanyah Sans',sans-serif;font-weight:700;color:var(--teal);
}

.about-article p,
.about-article li,
.static-page-article p,
.static-page-article li{
  font-family:'Thmanyah Serif Text',serif;
  font-size:clamp(16.5px,1.15vw,19px);
  line-height:2.05;
  color:#35535c;
  margin:0 0 1.15em;
}
.about-article > p:first-of-type,
.static-page-article > p:first-of-type{
  font-size:clamp(18px,1.4vw,22px);
  line-height:1.95;
  color:var(--ink);
  margin-bottom:1.4em;
}
.about-article > p:first-of-type::first-letter,
.static-page-article > p:first-of-type::first-letter{
  font-family:'Thmanyah Serif Display',serif;
  font-weight:800;
  font-size:3.15em;
  line-height:.78;
  color:var(--teal);
  padding-top:.12em;
}
[dir="rtl"] .about-article > p:first-of-type::first-letter,
[dir="rtl"] .static-page-article > p:first-of-type::first-letter{
  float:right;margin:0 0 .08em .16em;
}
[dir="ltr"] .about-article > p:first-of-type::first-letter,
[dir="ltr"] .static-page-article > p:first-of-type::first-letter{
  float:left;margin:0 .16em .08em 0;
}

.about-article a,
.static-page-article a{
  color:var(--teal);font-weight:700;
  text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:.18em;
}
.about-article a:hover,
.static-page-article a:hover{color:var(--ink)}

.about-article ul,
.about-article ol,
.static-page-article ul,
.static-page-article ol{
  margin:0 0 1.4em;padding:0;
  list-style:none;
}
.about-article ul li,
.about-article ol li,
.static-page-article ul li,
.static-page-article ol li{
  position:relative;
  padding-inline-start:1.35rem;
  margin:0 0 .55em;
  display:block;
}
.about-article ul li::before,
.static-page-article ul li::before{
  content:"";position:absolute;top:.85em;inset-inline-start:0;
  width:8px;height:8px;border-radius:50%;
  background:var(--teal);box-shadow:0 0 0 4px rgba(11,131,128,.12);
}
.about-article ol,
.static-page-article ol{counter-reset:static-ol}
.about-article ol li,
.static-page-article ol li{counter-increment:static-ol;padding-inline-start:2.1rem}
.about-article ol li::before,
.static-page-article ol li::before{
  content:counter(static-ol, decimal-leading-zero);
  position:absolute;inset-inline-start:0;top:.15em;
  font-family:'Thmanyah Serif Display',serif;
  font-size:13px;font-weight:800;color:var(--teal);
}

.about-article blockquote,
.static-page-article blockquote{
  margin:2em 0;
  padding:1.35rem 1.5rem 1.2rem;
  background:linear-gradient(135deg,#eef6f6,#f7fbfb);
  border:1px solid rgba(11,131,128,.18);
  border-inline-start:4px solid var(--teal);
  border-radius:18px;
  position:relative;
  color:var(--ink);
  font-family:'Thmanyah Serif Text',serif;
  font-size:clamp(18px,1.35vw,22px);
  line-height:1.8;
}
.about-article blockquote:before,
.static-page-article blockquote:before{
  content:"“";
  position:absolute;top:.15rem;inset-inline-end:1rem;
  font-size:4rem;line-height:1;color:rgba(11,131,128,.18);
  font-family:Georgia,'Thmanyah Serif Display',serif;
}
.about-article blockquote p,
.static-page-article blockquote p{margin:0;color:var(--ink);font-size:inherit}
.about-article blockquote p + p,
.static-page-article blockquote p + p{margin-top:.75em}

.about-article hr,
.static-page-article hr{
  border:0;height:1px;margin:2.4em auto;
  max-width:180px;
  background:linear-gradient(90deg,transparent,var(--teal),transparent);
}

.about-article img,
.static-page-article img{
  max-width:100%;height:auto;border-radius:22px;
  margin:1.6em 0;box-shadow:0 18px 40px rgba(13,47,58,.1);
}
.about-article figure,
.static-page-article figure{margin:1.8em 0}
.about-article figcaption,
.static-page-article figcaption{
  margin-top:.65em;font-size:13px;color:var(--muted);
  font-family:'Thmanyah Sans',sans-serif;
}

.about-article strong,
.static-page-article strong{color:var(--ink);font-weight:700}
.about-article em,
.static-page-article em{font-style:italic;color:var(--ink-2)}

.about-article table,
.static-page-article table{
  width:100%;border-collapse:collapse;margin:1.4em 0;font-size:15px;
}
.about-article th,.about-article td,
.static-page-article th,.static-page-article td{
  border-bottom:1px solid var(--line);padding:.7em .4em;text-align:start;
}
.about-article th,
.static-page-article th{color:var(--teal);font-weight:800;font-family:'Thmanyah Sans',sans-serif}

/* Beat leftover .prose helpers in style.css (same or lower specificity). */
.about-article.prose h2,
.static-page-article.prose h2{
  display:block;align-items:unset;gap:unset;
  border-bottom:0;padding-bottom:0;color:var(--ink);
}
.about-article.prose h3,
.static-page-article.prose h3{color:var(--ink-2);font-size:clamp(18px,1.6vw,22px)}
.about-article.prose p,
.static-page-article.prose p{
  color:#35535c;font-size:clamp(16.5px,1.15vw,19px);line-height:2.05;margin:0 0 1.15em;
}
.about-article.prose > p:first-of-type,
.static-page-article.prose > p:first-of-type{
  font-size:clamp(18px,1.4vw,22px);line-height:1.95;color:var(--ink);
}
.about-article.prose ul,.about-article.prose ol,
.static-page-article.prose ul,.static-page-article.prose ol{list-style:none;padding:0;margin:0 0 1.4em}
.about-article.prose ul li,.about-article.prose ol li,
.static-page-article.prose ul li,.static-page-article.prose ol li{
  display:block;align-items:unset;gap:unset;padding-inline-start:1.35rem;
}
.about-article.prose ul li::before,
.static-page-article.prose ul li::before{
  content:"";width:8px;height:8px;margin-top:0;flex-shrink:unset;
  position:absolute;top:.85em;inset-inline-start:0;border-radius:50%;
  background:var(--teal);box-shadow:0 0 0 4px rgba(11,131,128,.12);
}

@media (max-width:980px){
  .about-stage--with-media,
  .static-page-stage--with-media{grid-template-columns:1fr}
  .about-portrait,
  .static-page-portrait{position:static}
  .page-section.about-page .container:before{display:none}
}
@media (max-width:760px){
  .about-article,
  .static-page-article{border-radius:24px;padding:24px 18px 32px}
  .about-article h2,
  .static-page-article h2{font-size:24px}
  .about-article > p:first-of-type::first-letter,
  .static-page-article > p:first-of-type::first-letter{font-size:2.55em}
  .about-page-content{padding:24px 18px}
  .page-hero--about h1{max-width:none}
}

/* Donate listing — RTL sidebar + grid */
.donate-listing{padding-block:28px 64px;background:linear-gradient(180deg,#f7fbfb 0%,#eef6f6 100%)}
.donate-listing__layout{
  display:grid;
  grid-template-columns:minmax(240px,280px) minmax(0,1fr);
  gap:28px;
  align-items:start;
}
.donate-filters{
  position:sticky;top:96px;
  background:#eef3f3;
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 12px 32px rgba(13,47,58,.04);
  overflow:hidden;
}
.donate-filters__summary{
  list-style:none;cursor:pointer;user-select:none;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 20px;font-weight:800;color:var(--ink);font-size:1.05rem;
  background:#e8f0f0;border-bottom:1px solid var(--line);
}
.donate-filters__summary::-webkit-details-marker{display:none}
.donate-filters__summary span{display:inline-flex;align-items:center;gap:8px}
.donate-filters__caret{transition:transform .2s ease;color:var(--muted)}
.donate-filters__drawer[open] .donate-filters__caret{transform:rotate(180deg)}
.donate-filters__body{padding:8px 16px 18px}
.donate-filters__block{padding:14px 0;border-bottom:1px solid rgba(210,227,226,.8)}
.donate-filters__block:last-of-type{border-bottom:0}
.donate-filters__block--secondary{padding-top:8px}
.donate-filters__label{
  display:block;margin-bottom:10px;
  font-size:12px;font-weight:800;letter-spacing:.04em;
  color:var(--ink-2);text-transform:none;
}
.donate-filters__search{position:relative}
.donate-filters__search i{
  position:absolute;top:50%;inset-inline-start:12px;transform:translateY(-50%);
  color:#8aa0a8;font-size:1rem;pointer-events:none;
}
.donate-filters__search input{
  width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;
  padding:11px 14px;padding-inline-start:38px;font-size:.92rem;color:var(--ink);
}
.donate-filters__search input:focus{
  outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,131,128,.12);
}
.donate-filters__list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.donate-filters__item{
  display:flex;align-items:center;gap:10px;
  padding:9px 10px;border-radius:12px;color:var(--ink-2);
  text-decoration:none;font-size:.95rem;font-weight:600;transition:.15s ease;
}
.donate-filters__item:hover{background:rgba(11,131,128,.08);color:var(--teal)}
.donate-filters__item.is-active{
  background:rgba(11,131,128,.12);color:var(--teal);
  box-shadow:inset 3px 0 0 var(--teal);
}
[dir="rtl"] .donate-filters__item.is-active{box-shadow:inset -3px 0 0 var(--teal)}
.donate-filters__item-flag{font-size:1.15rem;line-height:1;width:1.4rem;text-align:center;display:inline-flex;align-items:center;justify-content:center}
.donate-filters__flag-img{
  width:1.25rem;height:.9rem;object-fit:cover;border-radius:2px;
  box-shadow:0 0 0 1px rgba(13,47,58,.12);
  display:block;
}
.donate-filters__flag-img--emoji{font-size:1.15rem;line-height:1;width:auto;height:auto;box-shadow:none;border-radius:0}
.donate-filters__item-icon{
  width:1.4rem;display:inline-flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:1.05rem;
}
.donate-filters__item.is-active .donate-filters__item-icon{color:var(--teal)}
.donate-filters__select{
  width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;
  padding:10px 12px;font-size:.9rem;color:var(--ink);
}
.donate-filters__actions{display:grid;gap:8px;margin-top:8px}
.donate-filters__submit{width:100%;justify-content:center}
.donate-filters__clear{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 12px;border-radius:12px;border:1px solid var(--line);
  color:var(--muted);font-size:.88rem;font-weight:700;text-decoration:none;background:#fff;
}
.donate-filters__clear:hover{color:var(--ink);border-color:#b8cecd}

.donate-listing__main{min-width:0}
.donate-listing__toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;margin-bottom:16px;
}
.donate-listing__count{margin:0;color:#7a8f97;font-size:.92rem;font-weight:600}
.donate-listing__sort{display:inline-flex;align-items:center;gap:8px}
.donate-listing__sort label{font-size:.88rem;font-weight:700;color:var(--ink-2);white-space:nowrap}
.donate-listing__sort select{
  border:1px solid var(--line);background:#fff;border-radius:12px;
  padding:8px 12px;font-size:.9rem;color:var(--ink);min-width:140px;
}
.donate-listing__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.donate-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border-radius:999px;background:#fff;
  border:1px solid var(--line);color:var(--ink-2);
  text-decoration:none;font-size:.82rem;font-weight:700;
}
.donate-chip:hover{border-color:var(--teal);color:var(--teal)}
.donate-listing__grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;
}
.donate-card{
  background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:0 14px 34px rgba(13,47,58,.05);
  display:flex;flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.donate-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(13,47,58,.08)}
.donate-card__media{position:relative;display:block;height:190px;overflow:hidden;background:#e8f0f0}
.donate-card__media img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .7s ease;
}
.donate-card:hover .donate-card__media img{transform:scale(1.03)}
.donate-card__urgent{
  position:absolute;top:12px;inset-inline-start:12px;
  display:inline-flex;align-items:center;gap:4px;
  background:#f5c542;color:#1a1a1a;border-radius:10px;
  padding:5px 9px;font-size:.72rem;font-weight:800;
}
.donate-card__country{
  position:absolute;top:12px;inset-inline-end:12px;
  display:inline-flex;align-items:center;gap:5px;
  background:rgba(255,255,255,.96);color:var(--ink);
  border-radius:999px;padding:5px 10px;font-size:.72rem;font-weight:800;
  border:1px solid rgba(255,255,255,.7);box-shadow:0 4px 14px rgba(13,47,58,.08);
}
.donate-card__body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.donate-card__category{
  font-size:.72rem;font-weight:800;letter-spacing:.06em;
  color:#8aa0a8;text-transform:uppercase;margin-bottom:6px;
}
.donate-card__title{margin:0 0 8px;font-size:1.15rem;line-height:1.35;color:var(--ink)}
.donate-card__title a{color:inherit;text-decoration:none}
.donate-card__title a:hover{color:var(--teal)}
.donate-card__desc{
  margin:0 0 14px;color:var(--muted);font-size:.9rem;line-height:1.65;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.donate-listing__empty{
  text-align:center;padding:64px 20px;color:var(--muted);
  background:#fff;border:1px dashed var(--line);border-radius:20px;
}
.donate-listing__empty i{display:block;font-size:3rem;color:#c5d5d4;margin-bottom:12px}
.donate-listing__empty .btn{margin-top:16px}
.donate-listing__pagination{margin-top:36px;display:flex;justify-content:center}
.donate-listing__pagination ul{display:inline-flex;align-items:center;gap:8px;list-style:none;margin:0;padding:0}
.donate-listing__pagination a{
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:14px;border:1px solid var(--line);color:var(--ink-2);
  text-decoration:none;font-weight:800;background:#fff;transition:.15s ease;
}
.donate-listing__pagination a:hover,
.donate-listing__pagination a.is-active{
  background:var(--teal);border-color:transparent;color:#fff;
}

@media (max-width:1200px){
  .donate-listing__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .donate-listing__layout{grid-template-columns:1fr}
  .donate-filters{position:static}
  .donate-filters__summary{border-radius:0}
}
@media (max-width:760px){
  .donate-listing__grid{grid-template-columns:1fr}
  .donate-listing__toolbar{align-items:stretch}
  .donate-listing__sort{width:100%;justify-content:space-between}
  .donate-listing__sort select{flex:1}
}

/* Donate / article leftover accent helpers (Design tokens) */
.salam-soft-panel{
  background:#fff;border:1px solid var(--line);border-radius:18px;
  box-shadow:0 10px 28px rgba(13,47,58,.04);
}
.salam-focus:focus{
  outline:none;border-color:var(--teal)!important;
  box-shadow:0 0 0 3px rgba(11,131,128,.12)!important;
}
.salam-link{color:var(--teal);font-weight:700}
.salam-link:hover{text-decoration:underline}
.salam-badge-ok{
  color:var(--teal);background:rgba(11,131,128,.12);
}
.salam-text-ink{color:var(--ink)}
.salam-text-teal{color:var(--teal)}
.salam-text-blue{color:var(--blue)}
.salam-bg-teal{background:var(--teal);color:#fff}
.salam-bg-blue{background:var(--blue);color:#fff}
.salam-border-line{border-color:var(--line)}
.salam-cta-gradient{
  background:linear-gradient(135deg,var(--teal),var(--blue));
  color:#fff;
}

@media (max-width:760px){
  .tool-grid,.tool-nisab-grid,.kaffarah-type-grid{grid-template-columns:1fr}
  .tool-panel__body,.tool-panel__foot{padding:20px}
  .tool-result-value--lg{font-size:32px}
  .cms-content-shell,.legal-page-shell{padding:20px}
  .tool-select-wrap{max-width:none}
}

/* Last-file contact row lock (beats cached main.css + Tailwind preflight). */
.footer-contact-title,
.footer-contact-item{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:8px !important;
}
.footer-contact-item svg,
.footer-contact-ico svg{
  width:15px !important;
  height:15px !important;
  max-width:15px !important;
}
