/* Sanya Donate — stylesheet */
:root{
  --green:#10b981; --green-d:#059669; --green-l:#d1fae5;
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --bg:#f8fafc;
  --amber:#f59e0b; --red:#ef4444; --blue:#3b82f6;
  --radius:14px; --shadow:0 1px 3px rgba(15,23,42,.08),0 8px 24px rgba(15,23,42,.05);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--green-d);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1060px;margin:0 auto;padding:0 18px}
.muted{color:var(--muted)}
.small{font-size:.85rem}
.raised{color:var(--green-d)}
h1,h2,h3{line-height:1.2;margin:.2em 0 .5em}

/* impersonation bar */
.imp-bar{background:#1e293b;color:#fff;text-align:center;padding:8px;font-size:.9rem}
.imp-bar a{color:#7dd3fc}

/* topbar */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;height:62px}
.brand{font-weight:800;font-size:1.25rem;color:var(--ink);display:flex;align-items:center;gap:7px}
.brand:hover{text-decoration:none}
.brand-mark{color:var(--green)}
.brand-sub{color:var(--muted);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.nav{display:flex;align-items:center;gap:18px;font-weight:600;font-size:.95rem}
.nav a{color:var(--ink)}
@media(max-width:640px){.nav{gap:11px;font-size:.85rem}.nav a:not(.btn):not(.lang-switch a){display:none}}
.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.lang-switch a{padding:5px 9px;font-size:.78rem;font-weight:700;color:var(--muted)}
.lang-switch a:hover{text-decoration:none;background:#f1f5f9}
.lang-switch a.on{background:var(--green);color:#fff}

/* page */
.page{padding:26px 18px 60px}

/* buttons */
.btn{display:inline-block;border:1px solid transparent;border-radius:10px;padding:10px 18px;
  font-weight:700;font-size:.95rem;cursor:pointer;text-align:center;transition:.15s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:var(--green);color:#fff}
.btn-primary:hover{background:var(--green-d);color:#fff}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:#f1f5f9}
.btn-danger{background:var(--red);color:#fff}
.btn-block{display:block;width:100%}
.btn-lg{padding:14px 26px;font-size:1.05rem}
.btn-sm{padding:6px 12px;font-size:.85rem}

/* alerts */
.alert{padding:12px 16px;border-radius:10px;margin-bottom:16px;font-weight:600;border:1px solid}
.alert-success{background:var(--green-l);border-color:#a7f3d0;color:#065f46}
.alert-danger{background:#fee2e2;border-color:#fecaca;color:#991b1b}
.alert-warning{background:#fef3c7;border-color:#fde68a;color:#92400e}
.alert-info{background:#dbeafe;border-color:#bfdbfe;color:#1e40af}

/* cards */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-body{padding:20px}
.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:820px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid-3,.grid-2{grid-template-columns:1fr}}

/* hero */
.hero{background:linear-gradient(135deg,#065f46,#10b981);color:#fff;border-radius:20px;padding:48px 34px;margin-bottom:30px}
.hero h1{font-size:2.3rem;margin:0 0 12px;max-width:680px}
.hero p{font-size:1.15rem;opacity:.95;max-width:560px;margin:0 0 22px}
.hero .btn-primary{background:#fff;color:var(--green-d)}
.hero .btn-ghost{border-color:rgba(255,255,255,.6);color:#fff}
@media(max-width:640px){.hero{padding:34px 22px}.hero h1{font-size:1.7rem}}

/* campaign card */
.ccard{display:flex;flex-direction:column;overflow:hidden}
.ccard .cover{height:160px;background:var(--green-l) center/cover no-repeat;position:relative}
.ccard .cat{position:absolute;top:10px;left:10px;background:rgba(15,23,42,.78);color:#fff;
  font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:20px}
.ccard .cbody{padding:16px;display:flex;flex-direction:column;flex:1}
.ccard h3{font-size:1.05rem;margin:0 0 6px}
.ccard h3 a{color:var(--ink)}
.ccard .excerpt{color:var(--muted);font-size:.9rem;flex:1;margin-bottom:12px}

/* progress */
.prog{height:9px;background:#e2e8f0;border-radius:20px;overflow:hidden;margin:8px 0}
.prog > i{display:block;height:100%;background:linear-gradient(90deg,#10b981,#059669);border-radius:20px;transition:width .6s}
.prog-meta{display:flex;justify-content:space-between;font-size:.85rem;font-weight:700}
.prog-meta .raised{color:var(--green-d)}
.prog-meta .goal{color:var(--muted);font-weight:600}

/* status pill */
.pill{display:inline-block;font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:20px}
.pill-pending{background:#fef3c7;color:#92400e}
.pill-active{background:var(--green-l);color:#065f46}
.pill-completed{background:#dbeafe;color:#1e40af}
.pill-rejected,.pill-failed{background:#fee2e2;color:#991b1b}
.pill-paused,.pill-closed{background:#e2e8f0;color:#475569}
.pill-paid{background:var(--green-l);color:#065f46}
.pill-requested{background:#fef3c7;color:#92400e}
.pill-approved{background:#dbeafe;color:#1e40af}

/* forms */
.form-row{margin-bottom:16px}
.form-row label{display:block;font-weight:700;margin-bottom:6px;font-size:.92rem}
.input,select,textarea{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;
  font-size:1rem;font-family:inherit;background:#fff}
.input:focus,select:focus,textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--green-l)}
textarea{min-height:130px;resize:vertical}
.hint{font-size:.82rem;color:var(--muted);margin-top:4px}
.form-narrow{max-width:460px;margin:0 auto}

/* layout helpers */
.split{display:grid;grid-template-columns:1.7fr 1fr;gap:26px;align-items:start}
@media(max-width:860px){.split{grid-template-columns:1fr}}
.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:26px 0 14px}
.export-btns{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.stack > * + *{margin-top:14px}
.sticky{position:sticky;top:84px}

/* tables */
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.table th,.table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:.92rem}
.table th{background:#f8fafc;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.table tr:last-child td{border-bottom:none}
.table-wrap{overflow-x:auto}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
@media(max-width:680px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.stat .n{font-size:1.6rem;font-weight:800}
.stat .l{color:var(--muted);font-size:.85rem;font-weight:600}

/* donor wall */
.donor{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
.donor:last-child{border:none}
.donor .dn{font-weight:700;font-size:.92rem}
.donor .dm{color:var(--muted);font-size:.85rem}
.donor .da{font-weight:800;color:var(--green-d);white-space:nowrap}

/* share */
.share{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.share a{flex:1;text-align:center;min-width:90px;padding:9px;border-radius:10px;color:#fff;font-weight:700;font-size:.85rem}
.share .wa{background:#25d366}.share .fb{background:#1877f2}.share .tw{background:#0f172a}.share .cp{background:#475569}

.story{font-size:1.02rem;white-space:pre-wrap;line-height:1.7}
.cover-lg{height:300px;border-radius:var(--radius);background:var(--green-l) center/cover no-repeat;margin-bottom:18px}
.empty{text-align:center;padding:50px 20px;color:var(--muted)}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.tabs a{padding:7px 14px;border-radius:20px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:.88rem;color:var(--ink)}
.tabs a.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* tip selector */
.tip-box{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:12px;padding:12px}
.tip-opts{display:flex;gap:8px;flex-wrap:wrap}
.tip-opt{flex:1;min-width:60px;text-align:center;padding:9px 6px;border:1px solid var(--line);border-radius:10px;
  background:#fff;font-weight:700;font-size:.9rem;cursor:pointer;user-select:none;transition:.12s}
.tip-opt.on{background:var(--green);color:#fff;border-color:var(--green)}

/* payment breakdown */
.breakdown{border:1px dashed var(--line);border-radius:10px;padding:12px;font-size:.92rem}
.breakdown > div{display:flex;justify-content:space-between;padding:3px 0}
.breakdown .bd-total{border-top:1px solid var(--line);margin-top:6px;padding-top:8px;font-size:1.05rem}
.breakdown .bd-total b{color:var(--green-d)}

/* footer */
.footer{background:#fff;border-top:1px solid var(--line);margin-top:40px;padding:30px 0}
.footer-inner{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:20px}
@media(max-width:640px){.footer-inner{grid-template-columns:1fr}}
.footer-links{display:flex;flex-direction:column;gap:6px}
.footer-links a{color:var(--ink)}
