[x-cloak] { display:none !important; }

/* ── Table ─────────────────────────────────────────────── */
.tbl th { font-size:.77rem;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:.04em;padding:.7rem 1rem;border-bottom:1px solid #f0f0f0; }
.tbl td { padding:.75rem 1rem;vertical-align:middle;font-size:.875rem; }
.tbl tr:hover td { background:#f8fffe; }

/* ── Type / status badges ───────────────────────────────── */
.badge-type {
  display:inline-flex;align-items:center;gap:.3rem;
  padding:.2rem .65rem;border-radius:20px;font-size:.72rem;font-weight:700;
}
.badge-receipt     { background:#eff6ff;color:#1d4ed8; }
.badge-certificate { background:#fdf4ff;color:#7c3aed; }
.badge-active   { background:#d1fae5;color:#065f46; }
.badge-inactive { background:#f3f4f6;color:#9ca3af; }

/* ── Donation-type chips on row ─────────────────────────── */
.dtype-chip {
  display:inline-block;padding:.1rem .5rem;border-radius:20px;
  background:#f0fdf9;border:1px solid #b2dcd5;
  font-size:.7rem;font-weight:600;color:#1b6055;margin:.1rem .15rem;
}

/* ── Side panel ─────────────────────────────────────────── */
.tpl-overlay {
  position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:1100;
}
.tpl-panel {
  position:fixed;top:0;right:0;height:100%;width:560px;max-width:96vw;
  background:#fff;box-shadow:-6px 0 40px rgba(0,0,0,.15);
  display:flex;flex-direction:column;z-index:1101;
}
.tpl-panel-header {
  padding:1rem 1.4rem;border-bottom:1px solid #f0f0f0;
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
}
.tpl-panel-header h5 { margin:0;font-size:1rem;font-weight:700; }
.tpl-panel-body {
  flex:1;overflow-y:auto;padding:1.2rem 1.4rem;
}
.tpl-panel-footer {
  padding:1rem 1.4rem;border-top:1px solid #f0f0f0;flex-shrink:0;
  display:flex;gap:.6rem;justify-content:flex-end;background:#fff;
}

/* ── Accordion sections ─────────────────────────────────── */
.acc-section { border:1px solid #e5e7eb;border-radius:10px;margin-bottom:.75rem;overflow:hidden; }
.acc-header {
  display:flex;align-items:center;justify-content:space-between;
  padding:.7rem 1rem;background:#f9fafb;cursor:pointer;user-select:none;
}
.acc-header:hover { background:#f3f4f6; }
.acc-title { font-size:.84rem;font-weight:700;color:#1a1a1a;display:flex;align-items:center;gap:.5rem; }
.acc-title i { color:var(--theme-deafult,#1b6055);font-size:.8rem; }
.acc-chevron { font-size:.7rem;color:#aaa;transition:transform .2s; }
.acc-chevron.open { transform:rotate(180deg); }
.acc-body { padding:.9rem 1rem; }

/* ── Image upload thumb ─────────────────────────────────── */
.img-thumb-wrap {
  display:flex;align-items:center;gap:.75rem;margin-top:.5rem;
}
.img-thumb {
  width:64px;height:64px;border-radius:8px;object-fit:contain;
  border:1.5px solid #e5e7eb;background:#fafafa;padding:3px;
}
.img-thumb-placeholder {
  width:64px;height:64px;border-radius:8px;border:1.5px dashed #d1d5db;
  background:#fafafa;display:flex;align-items:center;justify-content:center;
  color:#d1d5db;font-size:1.2rem;
}

/* ── Placeholder vars hint ──────────────────────────────── */
.vars-hint {
  background:#f8fffe;border:1px solid #d1e7e1;border-radius:8px;
  padding:.6rem .85rem;font-size:.73rem;color:#555;line-height:1.6;margin-top:.4rem;
}
.vars-hint code {
  background:#e8f5f3;border-radius:4px;padding:.05rem .3rem;
  font-size:.71rem;color:#1b6055;
}

/* ── Toast ───────────────────────────────────────────────── */
.tpl-toast {
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:2100;
  background:#065f46;color:#fff;padding:.75rem 1.25rem;
  border-radius:10px;font-size:.875rem;font-weight:600;
  box-shadow:0 4px 20px rgba(0,0,0,.2);
}