
.kqd-campaign-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.kqd-campaign-card{display:block;border:1px solid #e7e7ef;border-radius:14px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;box-shadow:0 6px 22px rgba(17,17,26,.06)}
.kqd-thumb img{width:100%;height:auto;display:block}
.kqd-card-body{padding:14px}
.kqd-title{margin:0 0 10px;font-size:16px;line-height:1.3}
.kqd-progress{height:10px;background:#f0f1f5;border-radius:999px;overflow:hidden}
.kqd-progress span{display:block;height:100%;background:linear-gradient(90deg,#7b61ff,#ff4d7d)}
.kqd-progress.kqd-lg{height:12px;margin:10px 0}
.kqd-meta{display:flex;gap:12px;justify-content:space-between;margin-top:10px}
.kqd-meta-inline{flex-wrap:wrap}
.kqd-meta small{color:#6b7280}
.kqd-campaign-box{border:1px solid #e7e7ef;border-radius:14px;padding:16px;background:#fff}
.kqd-campaign-content{margin-top:10px}

.kqd-donate{border:1px solid #e7e7ef;border-radius:14px;padding:16px;background:#fff}
.kqd-donate-title{margin:0 0 12px}
.kqd-form{display:block}
.kqd-row{margin-bottom:12px}
.kqd-row label{display:block;font-weight:600;margin-bottom:6px}
.kqd-row input[type="text"],.kqd-row input[type="email"],.kqd-row input[type="number"],.kqd-row textarea{width:100%;border:1px solid #e7e7ef;border-radius:12px;padding:10px 12px;font-size:14px}
.kqd-inline label{display:flex;gap:8px;align-items:center;font-weight:500}
.kqd-submit{width:100%;border:none;border-radius:12px;padding:12px 14px;font-weight:700;color:#fff;background:linear-gradient(90deg,#7b61ff,#ff4d7d);cursor:pointer}
.kqd-small{font-size:12px}
.kqd-muted{color:#6b7280}
.kqd-alert{padding:10px 12px;border-radius:12px;background:#fff3cd;border:1px solid #ffe69c}

.kqd-amount-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:10px}
.kqd-amt-btn{border:1px solid #e7e7ef;background:#fff;border-radius:12px;padding:10px;cursor:pointer;font-weight:700}
.kqd-amt-btn.is-active{border-color:#7b61ff;box-shadow:0 0 0 3px rgba(123,97,255,.15)}
.kqd-custom-amount{display:none}
.kqd-custom-amount.is-show{display:block}

.kqd-style-list .kqd-row{display:grid;grid-template-columns:180px 1fr;gap:10px;align-items:center}
.kqd-style-list .kqd-row label{margin-bottom:0}
@media (max-width:640px){
  .kqd-style-list .kqd-row{grid-template-columns:1fr}
}

.kqd-typing-steps .kqd-step{display:none}
.kqd-typing-steps[data-step="1"] .kqd-step-1{display:block}
.kqd-typing-steps[data-step="2"] .kqd-step-2{display:block}
.kqd-typing-steps[data-step="3"] .kqd-step-3{display:block}
.kqd-actions{display:flex;gap:10px}
.kqd-actions button{flex:1;border:1px solid #e7e7ef;border-radius:12px;padding:10px;background:#fff;cursor:pointer;font-weight:700}
.kqd-actions .kqd-submit{border:none}

.kqd-thankyou .kqd-box{border:1px solid #e7e7ef;border-radius:14px;padding:16px;background:#fff}
.kqd-pill{display:inline-block;padding:6px 10px;border-radius:999px;font-weight:800;margin:8px 0}
.kqd-pill-pending{background:#fff3cd;border:1px solid #ffe69c}
.kqd-pill-success{background:#d1e7dd;border:1px solid #a3cfbb}
.kqd-pill-failed{background:#f8d7da;border:1px solid #f1aeb5}
.kqd-bank{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:10px 0}
.kqd-rowline{margin:6px 0}
.kqd-hr{border:none;border-top:1px solid #eee;margin:12px 0}

.kqd-donors{border:1px solid #e7e7ef;border-radius:14px;padding:16px;background:#fff;margin-top:16px}
.kqd-donor-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kqd-donor-list li{display:flex;gap:10px;justify-content:space-between;border:1px solid #eef0f6;border-radius:12px;padding:10px}
.kqd-donor-name{font-weight:800}
.kqd-donor-msg{color:#6b7280;font-size:12px;margin-top:4px;max-width:520px}


.kqd-container{max-width:1100px;margin:0 auto;padding:16px}
.kqd-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:start}
.kqd-hero-cover img{width:100%;height:auto;border-radius:16px;border:1px solid #e7e7ef;box-shadow:0 6px 22px rgba(17,17,26,.06)}
.kqd-h1{font-size:28px;line-height:1.2;margin:0 0 12px}
.kqd-lead{font-size:15px;color:#374151}
.kqd-summary-card{background:#fff;border:1px solid #e7e7ef;border-radius:16px;padding:16px;box-shadow:0 6px 22px rgba(17,17,26,.06);margin-bottom:12px}
.kqd-summary-top{display:flex;gap:12px;justify-content:space-between;align-items:flex-end}
.kqd-h2{font-size:22px;font-weight:900;margin-top:4px}
.kqd-h3{font-size:16px;font-weight:900;margin-top:4px}
.kqd-right{text-align:right}
.kqd-summary-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.kqd-strong{font-weight:900}
.kqd-sticky{position:sticky;top:14px}
.kqd-content-grid{display:grid;grid-template-columns:1fr 360px;gap:18px;margin-top:18px}
.kqd-section{margin-bottom:16px}
.kqd-box{background:#fff;border:1px solid #e7e7ef;border-radius:16px;padding:16px;box-shadow:0 6px 22px rgba(17,17,26,.06)}
.kqd-h2s{margin:0 0 10px;font-size:18px}
.kqd-prose{background:#fff;border:1px solid #e7e7ef;border-radius:16px;padding:16px}
.kqd-prose p{margin-top:0}
.kqd-messages{display:grid;gap:10px}
.kqd-message{background:#fff;border:1px solid #eef0f6;border-radius:14px;padding:12px}
.kqd-message-body{margin-top:8px;color:#111827}
.kqd-donor-list2{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kqd-donor-list2 li{display:flex;justify-content:space-between;gap:10px;border:1px solid #eef0f6;border-radius:12px;padding:10px}
.kqd-donor-right{font-weight:900}
@media (max-width:960px){
  .kqd-hero{grid-template-columns:1fr}
  .kqd-content-grid{grid-template-columns:1fr}
  .kqd-sticky{position:static}
}


/* ===== v1.1.0 Mobile Campaign Layout ===== */
.kqd-mobile-page{max-width:720px;margin:0 auto;padding:0 0 84px}
.kqd-cover img{width:100%;height:auto;display:block}
.kqd-card{background:#fff;border:1px solid #e7e7ef;border-radius:16px;padding:16px;margin:14px 12px;box-shadow:0 6px 22px rgba(17,17,26,.06)}
.kqd-card-main{margin-top:-12px}
.kqd-title-1{font-size:22px;line-height:1.25;margin:0 0 12px}
.kqd-amount{font-size:22px;font-weight:900}
.kqd-amount-row{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.kqd-mini-stats{display:flex;justify-content:space-between;margin:10px 0 12px;font-weight:800}
.kqd-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:12px;padding:12px 14px;font-weight:900;color:#fff;background:#12a3ad;text-decoration:none}
.kqd-btn-big{width:100%;font-size:16px}
.kqd-btn-secondary{display:inline-flex;align-items:center;justify-content:center;border:2px solid #12a3ad;color:#12a3ad;background:#fff;border-radius:12px;padding:10px 14px;font-weight:900}
.kqd-btn-secondary span{font-weight:700;font-size:12px;opacity:.85}

.kqd-fundraiser{display:flex;gap:12px;align-items:center}
.kqd-fundraiser-logo{width:56px;height:56px;border-radius:999px;border:1px solid #e7e7ef;display:flex;align-items:center;justify-content:center;overflow:hidden}
.kqd-fundraiser-logo img{width:100%;height:100%;object-fit:cover}
.kqd-fundraiser-name{font-weight:900;font-size:16px}
.kqd-fundraiser-sub{color:#6b7280;font-weight:700}
.kqd-verified{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;background:#e7f8f9;color:#12a3ad;margin-right:6px;font-weight:900}

.kqd-tabs .kqd-tabbar{display:flex;gap:10px;overflow:auto;padding-bottom:6px;border-bottom:1px solid #eef0f6}
.kqd-tab{flex:0 0 auto;border:1px solid #e7e7ef;background:#fff;border-radius:12px;padding:10px 12px;font-weight:900}
.kqd-tab.is-active{background:#12a3ad;color:#fff;border-color:#12a3ad}
.kqd-pane{display:none;padding-top:14px}
.kqd-pane.is-active{display:block}
.kqd-prose2{color:#111827}
.kqd-prose2 img{max-width:100%;height:auto;border-radius:12px}

.kqd-updates{display:grid;gap:12px}
.kqd-update{display:grid;grid-template-columns:120px 1fr;gap:12px;border:1px solid #eef0f6;border-radius:14px;padding:10px;background:#fff}
.kqd-update-cover img{width:100%;height:90px;object-fit:cover;border-radius:12px;border:1px solid #eef0f6}
.kqd-update-title{margin:0 0 4px;font-size:15px}
.kqd-update-excerpt{margin-top:8px;color:#374151}
.kqd-details summary{cursor:pointer;margin-top:8px;color:#12a3ad;font-weight:900}

.kqd-donor-list3{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kqd-donor-list3 li{display:flex;justify-content:space-between;gap:10px;border:1px solid #eef0f6;border-radius:12px;padding:10px;background:#fff}

.kqd-doa-list{display:grid;gap:12px}
.kqd-doa{border:1px solid #eef0f6;border-radius:14px;padding:14px;background:#fff}
.kqd-doa-head{display:flex;justify-content:space-between;gap:10px;align-items:center}
.kqd-doa-name{font-weight:900;font-size:16px}
.kqd-doa-text{margin:10px 0 12px;color:#111827}
.kqd-amin-btn{display:inline-flex;gap:8px;align-items:center;border:none;background:transparent;color:#d32f2f;font-weight:900;cursor:pointer;padding:0}
.kqd-amin-btn.is-done{opacity:.75}

.kqd-actionbar{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1.2fr;gap:10px;background:#fff;border-top:1px solid #eef0f6;padding:10px 12px;z-index:999}
.kqd-actionbar a,.kqd-actionbar button{width:100%}

/* ===== Checkout UI ===== */
.kqd-checkout{max-width:720px;margin:0 auto;padding:12px 12px 18px}
.kqd-checkout-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.kqd-back{text-decoration:none;font-weight:900;color:#111827;border:1px solid #eef0f6;border-radius:12px;padding:8px 10px}
.kqd-checkout-title{font-weight:900}
.kqd-checkout-card{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #e7e7ef;border-radius:16px;padding:12px;box-shadow:0 6px 22px rgba(17,17,26,.06)}
.kqd-mini-cover{width:90px;height:64px;object-fit:cover;border-radius:12px}
.kqd-mini-title{font-weight:900}
.kqd-checkout-section{margin-top:14px}
.kqd-amount-grid-2{grid-template-columns:repeat(2,1fr)}
.kqd-input{width:100%;border:1px solid #e7e7ef;border-radius:14px;padding:14px 14px;font-size:16px}
.kqd-paybox{display:flex;justify-content:space-between;gap:10px;align-items:center;background:#eef8fb;border:1px solid #cfeaf1;border-radius:16px;padding:12px;margin:14px 0}
.kqd-paybox-left{display:flex;gap:10px;align-items:center}
.kqd-pay-icon{width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid #cfeaf1;display:flex;align-items:center;justify-content:center}
.kqd-select{border:1px solid #cfeaf1;background:#fff;border-radius:12px;padding:10px 12px;font-weight:900}
.kqd-sapaan{display:flex;gap:10px;align-items:center;margin:12px 0}
.kqd-seg{flex:1;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #e7e7ef;border-radius:12px;overflow:hidden}
.kqd-seg-btn{border:none;background:#fff;padding:10px 8px;font-weight:900;cursor:pointer}
.kqd-seg-btn.is-active{background:#12a3ad;color:#fff}
.kqd-toggle{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:10px 0 14px}
.kqd-toggle-label{color:#374151;font-weight:800}
.kqd-switch{position:relative;display:inline-block;width:54px;height:30px}
.kqd-switch input{opacity:0;width:0;height:0}
.kqd-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:#c9cdd4;transition:.2s;border-radius:999px}
.kqd-slider:before{position:absolute;content:"";height:24px;width:24px;left:3px;bottom:3px;background:white;transition:.2s;border-radius:999px}
.kqd-switch input:checked + .kqd-slider{background:#12a3ad}
.kqd-switch input:checked + .kqd-slider:before{transform:translateX(24px)}
.kqd-submit-fixed{position:sticky;bottom:0;margin-top:10px}


/* ===== v1.1.2 UI fixes (proportional buttons + amount line + template modes) ===== */
.kqd-amount-line{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.kqd-amount-sub{color:#6b7280;font-weight:700;font-size:14px}
.kqd-btn-shadow{box-shadow:0 10px 26px rgba(18,163,173,.22)}
.kqd-btn-primary{min-height:54px}
.kqd-btn-secondary{min-height:54px}

.kqd-actionbar{grid-template-columns:1fr 1.4fr}
.kqd-share-btn{display:flex;flex-direction:row;gap:10px;align-items:center;justify-content:center}
.kqd-share-ico{font-size:18px;font-weight:900;line-height:1}
.kqd-share-txt{display:flex;flex-direction:column;line-height:1.05}
.kqd-share-top{font-weight:900}
.kqd-share-sub{font-size:12px;font-weight:800;opacity:.85}

.kqd-progress-solid{background:#e6eef2}
.kqd-progress-solid span{background:#12a3ad}

.kqd-tabbar-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid #e7e7ef;border-radius:14px;overflow:hidden}
.kqd-tabbar-seg .kqd-tab{border:none;border-radius:0;background:#fff}
.kqd-tabbar-seg .kqd-tab.is-active{background:#12a3ad;color:#fff}

.kqd-home-fab{position:fixed;top:12px;right:12px;z-index:1000;width:46px;height:46px;border-radius:999px;background:rgba(255,255,255,.35);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid rgba(255,255,255,.55)}
.kqd-home-fab .kqd-home-ico{font-size:20px;font-weight:900;color:#111827}
.kqd-blank{background:#f7f7fb}


/* ===== v1.1.3 Styling tweaks to match reference ===== */
.kqd-amount-inline{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-bottom:12px}
.kqd-amount-inline .kqd-amount{font-size:22px;font-weight:900}
.kqd-amount-inline .kqd-amount-sub{font-size:14px;color:#6b7280;font-weight:700}

.kqd-btn-donate-main{
  background:#12a3ad;
  border-radius:14px;
  min-height:62px;
  font-size:18px;
  letter-spacing:.2px;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}
.kqd-btn-donate-main:active{transform:translateY(1px)}
.kqd-btn-donate-bar{
  background:#12a3ad;
  border-radius:14px;
  min-height:54px;
  font-size:16px;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}

/* Make share button match height and radius */
.kqd-actionbar .kqd-btn-secondary{border-radius:14px}


/* ===== v1.1.4 Layout Fixes ===== */
.kqd-mobile-page{padding-bottom:120px} /* prevent fixed bar overlap */

.kqd-card-main{padding:18px}
.kqd-amount-inline{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:6px 0 12px}
.kqd-amount-inline .kqd-amount{font-size:24px;font-weight:900}
.kqd-amount-inline .kqd-amount-sub{font-size:14px;color:#6b7280;font-weight:700}

.kqd-progress-solid{background:#e6eef2}
.kqd-progress-solid span{background:#12a3ad}

.kqd-btn-donate-main{
  width:100%;
  min-height:60px;
  border-radius:14px;
  font-size:18px;
  font-weight:900;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}
.kqd-btn-donate-bar{
  width:100%;
  min-height:56px;
  border-radius:14px;
  font-size:16px;
  font-weight:900;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}
.kqd-actionbar{grid-template-columns:1fr 1.4fr}
.kqd-actionbar .kqd-btn-secondary{min-height:56px;border-radius:14px}

/* Tabs like reference (not segmented full grid) */
.kqd-tabbar-ref{display:flex;gap:12px;overflow:auto;padding-bottom:10px;border-bottom:1px solid #eef0f6}
.kqd-tabbar-ref .kqd-tab{border-radius:12px;padding:10px 14px}



/* ===== DonasiAja-style single campaign (Mode: donasiaja) ===== */
.kqd-section-box{background:#fff;border:1px solid #e7e7ef;border-radius:6px;padding:14px 12px;margin:12px}
.kqd-section-image{margin:0}
.kqd-section-image img{width:100%;height:auto;display:block}
#kqd-header-title{position:sticky;top:0;z-index:99;display:flex;align-items:center;gap:10px;padding:10px 12px;margin:0;border-radius:0;border-left:0;border-right:0}
.kqd-nav-icon a{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;text-decoration:none;color:#23374d;background:#f3f6fb;border:1px solid #e7e7ef;font-weight:900}
.kqd-campaign-header-title{font-weight:900;color:#23374d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:75vw}
.kqd-donasiaja-wrap{padding-bottom:96px}
#kqd-campaign-title{border-top-left-radius:0;border-top-right-radius:0;margin-top:0}

.kqd-title h1{margin:0 0 10px;font-size:26px;line-height:1.2;color:#23374d}
.kqd-donation-box2{margin-top:8px}
.kqd-d-total{font-size:22px;font-weight:900;color:#23374d}
.kqd-d-target-text{margin-left:8px;font-size:14px;color:#7a8794;font-weight:700}
.kqd-donation-progress{position:relative;margin-top:10px}
.kqd-donation-progress{background:#e6eef2;border-radius:999px;height:12px}
.kqd-donation-progress-bar{position:absolute;left:0;top:0;bottom:0;background:#01acbe;border-radius:999px}
.kqd-d-target-graph{display:inline-block;margin-top:12px;font-weight:900;color:#23374d}
.kqd-d-date{float:right;margin-top:12px;font-weight:900;color:#7a8794}
.kqd-section-button{margin-top:18px}
.kqd-donation-button-now{width:100%;height:56px;border-radius:10px;border:2px solid #01acbe;background:#01acbe;color:#fff;font-weight:900;font-size:18px;cursor:pointer}
.kqd-donation-button-now2{width:100%;height:52px;border-radius:10px;border:2px solid #01acbe;background:#01acbe;color:#fff;font-weight:900;font-size:16px;cursor:pointer}

.kqd-penggalang-dana{display:flex;gap:12px;align-items:center}
.kqd-profile-picture img{width:64px;height:64px;border-radius:120px;border:1px solid #dde4ec;object-fit:cover;background:#fff}
.kqd-user-link span{font-weight:900;color:#23374d}
.kqd-user-verified{margin-top:4px;color:#a2b0ca;font-style:italic}
.kqd-verified-badge{display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;border-radius:999px;background:#e6f4ff;border:2px solid #01acbe;color:#01acbe;font-weight:900;margin-right:6px}

.kqd-nav-tabs{list-style:none;margin:0;padding:0;display:flex;gap:0;border-bottom:1px solid #eef0f6}
.kqd-nav-tabs li a{display:block;padding:10px 10px;font-size:13px;font-weight:900;color:#23374d;text-decoration:none;white-space:nowrap}
.kqd-nav-tabs li.active a{background:#01acbe;color:#fff;border-radius:6px 6px 0 0}
.kqd-scrollable-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}

.kqd-tab-pane{display:none;padding-top:12px}
.kqd-tab-pane.active{display:block}

.kqd-readmore{position:relative}
.kqd-readmore.kqd-collapsed{max-height:420px;overflow:hidden}
.kqd-readmore-fade{position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1))}
.kqd-readmore-btnwrap{position:absolute;left:0;right:0;bottom:0;text-align:center;padding-bottom:10px}
.kqd-btn-readmore{border:1px solid #01acbe;background:#fff;color:#01acbe;border-radius:999px;padding:6px 16px;font-weight:900;cursor:pointer;box-shadow:0 0 15px 5px #fff}

.kqd-timeline{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.kqd-timeline-item{padding-left:0}
.kqd-timeline-date{color:#7a8794;font-weight:900;margin-bottom:6px}
.kqd-timeline-title{margin:0 0 10px;color:#23374d}

.kqd-donor-switch{display:flex;gap:8px;margin:10px 0 14px}
.kqd-donor-btn{flex:0 0 auto;border:2px solid #01acbe;background:#fff;color:#01acbe;border-radius:6px;padding:8px 10px;font-weight:900;cursor:pointer;font-size:13px}
.kqd-donor-btn.is-active{background:#01acbe;color:#fff}

.kqd-donation-inner-box{border-radius:6px;background:rgb(250, 252, 255);padding:12px;border:1px solid #eef0f6;margin-bottom:10px}
.kqd-donation-name{font-weight:900;color:#23374d}
.kqd-donation-time{margin-left:8px;font-weight:800;color:#7a8794;font-size:12px}
.kqd-donation-total{margin-top:6px;color:#23374d}
.kqd-donation-comment{margin-top:8px;color:#23374d}

#kqd-fixed-button{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1.4fr;gap:10px;align-items:center;padding:10px 12px;border-radius:0;border-left:0;border-right:0;z-index:1000}
.kqd-donation-button-share{height:52px;border-radius:10px;border:2px solid #01acbe;background:#fff;color:#01acbe;font-weight:900;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.kqd-share-icon{font-size:16px;margin-bottom:2px}
.kqd-text-bagikan{font-size:12px;font-weight:800;opacity:.85}

#kqd-fixed-share-button{position:fixed;left:0;right:0;bottom:-500px;z-index:1100;transition:bottom .25s ease;border-top-left-radius:14px;border-top-right-radius:14px}
#kqd-fixed-share-button.kqd-show{bottom:0}
.kqd-share-title{font-weight:900;margin-bottom:10px}
.kqd-share-close{position:absolute;right:14px;top:14px;font-weight:900;cursor:pointer}
.kqd-social-button{width:100%;height:44px;border-radius:10px;border:1px solid #e7e7ef;background:#fff;font-weight:900;margin-bottom:10px;cursor:pointer}
.kqd-copy-link{border:2px solid #01acbe;color:#01acbe}

@media (max-width:480px){
  .kqd-section-box{margin:10px 10px}
  .kqd-title h1{font-size:24px}
}

#kqd-header-title.kqd-flying{box-shadow:0 6px 22px rgba(17,17,26,.12)}
#kqd-fixed-button.kqd-flying{box-shadow:0 -6px 22px rgba(17,17,26,.12)}


/* ===== v1.2.1 adjustments: no header, home icon overlay, footer appears from Keterangan ===== */
.kqd-home-overlay{
  position:absolute;
  top:12px;
  left:12px;
  z-index:10;
  width:42px;
  height:42px;
  border-radius:999px;
  background:rgba(255,255,255,.35);
  backdrop-filter:blur(6px);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.55);
  color:#111827;
  font-weight:900;
  font-size:18px;
}
.kqd-home-overlay-fixed{position:fixed}
.kqd-section-image{position:relative}

/* hide footer until activated by JS */
#kqd-fixed-button{display:none}
#kqd-fixed-button.kqd-show{display:grid}


/* ===== v1.2.2 desktop width + footer visibility fixes ===== */
.kqd-blank{background:#eef1f6}
.kqd-section-image,
.kqd-section-box{
  max-width: 720px;
  width: calc(100% - 24px);
  margin-left: auto;
  margin-right: auto;
}
.kqd-section-image{margin-top:0}
.kqd-section-image img{border-radius:0}

.kqd-donasiaja-wrap{
  max-width: 720px;
  width: calc(100% - 24px);
  margin: 0 auto;
  padding-bottom: 110px;
}

/* fixed footer centered */
#kqd-fixed-button{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
  width: min(720px, calc(100% - 24px));
}
#kqd-fixed-share-button{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
  width: min(720px, calc(100% - 24px));
}

/* show/hide handled by .kqd-show */
#kqd-fixed-button{display:none}
#kqd-fixed-button.kqd-show{display:grid}


/* ===== v1.2.3 progress text logic ===== */
.kqd-d-target-text{margin-left:8px;display:inline-block}


/* ===== v1.2.4 floating footer transform fix (always in DOM) ===== */
#kqd-fixed-button.kqd-fixedbar{
  display:grid !important;
  transform: translateX(-50%) translateY(120%);
  opacity: 0;
  pointer-events: none;
  transition: transform .22s ease, opacity .22s ease;
}
#kqd-fixed-button.kqd-fixedbar.kqd-show{
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events: auto;
}

#kqd-fixed-share-button.kqd-sharedrawer{
  display:block !important;
}
#kqd-fixed-share-button.kqd-sharedrawer{
  transform: translateX(-50%) translateY(110%);
  opacity: 0;
  pointer-events:none;
  transition: transform .22s ease, opacity .22s ease;
}
#kqd-fixed-share-button.kqd-sharedrawer.kqd-show{
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events:auto;
}


/* ===== v1.2.5 DonasiAja floating footer pattern ===== */
body.kqd-donasiaja #kqd-fixed-button{
  /* default: regular flow at end (not fixed) */
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  top: auto !important;
  transform: none !important;
  width: auto !important;
  max-width: 720px;
  margin: 12px auto 0;
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 10px;
  z-index: auto;
}

/* when scrolling passes threshold, JS adds .flying-button => becomes fixed */
body.kqd-donasiaja #kqd-fixed-button.flying-button{
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  top: auto !important;
  transform: translateX(-50%) !important;
  width: min(720px, calc(100% - 24px)) !important;
  margin: 0 !important;
  z-index: 999999 !important;
  box-shadow: 0 -6px 22px rgba(17,17,26,.12);
}

/* share drawer default hidden off-screen, show with .show-button */
body.kqd-donasiaja #kqd-fixed-share-button{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(720px, calc(100% - 24px)) !important;
  bottom: -560px;
  z-index: 999999 !important;
  transition: bottom .25s ease;
  display: block !important;
}
body.kqd-donasiaja #kqd-fixed-share-button.show-button{
  bottom: 0;
}

/* ensure action buttons same height */
body.kqd-donasiaja .kqd-donation-button-share,
body.kqd-donasiaja .kqd-donation-button-now2{
  height: 52px;
  border-radius: 10px;
}

/* small screens */
@media (max-width: 480px){
  body.kqd-donasiaja #kqd-fixed-button{
    width: calc(100% - 24px);
    margin-left: auto;
    margin-right: auto;
  }
}


/* ===== v1.2.6 override old fixedbar hiding rules ===== */
body.kqd-donasiaja #kqd-fixed-button.kqd-fixedbar{
  transform:none !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
body.kqd-donasiaja #kqd-fixed-button.kqd-fixedbar.kqd-show{
  transform:none !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
body.kqd-donasiaja #kqd-fixed-share-button.kqd-sharedrawer{
  transform: translateX(-50%) translateY(110%) !important;
  opacity: 0 !important;
  pointer-events:none !important;
}
body.kqd-donasiaja #kqd-fixed-share-button.kqd-sharedrawer.kqd-show{
  transform: translateX(-50%) translateY(0) !important;
  opacity: 1 !important;
  pointer-events:auto !important;
}


/* Campaign cards */
.kqd-campaigns{margin:18px 0}
.kqd-campaign-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.kqd-type-list .kqd-campaign-grid{grid-template-columns:1fr}
.kqd-campaign-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.07)}
.kqd-campaign-thumb img{width:100%;height:180px;object-fit:cover;display:block}
.kqd-campaign-thumb-placeholder{height:180px;background:#f1f5f9}
.kqd-campaign-body{padding:14px}
.kqd-campaign-title{font-weight:800;color:#0f172a;line-height:1.25;font-size:16px;margin-bottom:10px}
.kqd-campaign-org{display:flex;align-items:center;gap:8px;font-size:13px;color:#64748b;margin-bottom:10px}
.kqd-org-badge{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:99px;background:#e0f2fe;color:#0284c7;font-weight:900;font-size:12px}
.kqd-campaign-amount{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}
.kqd-amount{font-weight:900;color:#16a34a}
.kqd-amount-sub{font-size:12px;color:#64748b}
.kqd-campaign-progress{height:6px;background:#e2e8f0;border-radius:999px;overflow:hidden;margin-bottom:14px}
.kqd-campaign-progress-bar{height:100%;background:#16a34a}
.kqd-campaign-btn{display:block;text-align:center;background:#16a34a;color:#fff;text-decoration:none;padding:10px 12px;border-radius:10px;font-weight:800}
.kqd-campaign-btn:hover{opacity:.95}
.kqd-campaign-more{text-align:center;margin-top:12px}
.kqd-btn-loadmore{border:1px solid #cbd5e1;background:#fff;padding:10px 16px;border-radius:10px;cursor:pointer}
.kqd-btn-loadmore:disabled{opacity:.6;cursor:not-allowed}

/* Slider */
.kqd-type-slider .kqd-slider-track{display:flex;gap:16px;overflow-x:auto;padding:6px 6px 14px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.kqd-type-slider .kqd-campaign-card{flex:0 0 78%;max-width:420px;scroll-snap-align:start}
@media (min-width: 900px){.kqd-type-slider .kqd-campaign-card{flex:0 0 42%}}
.kqd-type-slider .kqd-slider-track::-webkit-scrollbar{height:8px}
.kqd-type-slider .kqd-slider-track::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}
.kqd-slider-dots{display:flex;justify-content:center;gap:8px;margin-top:6px}
.kqd-dot{width:8px;height:8px;border-radius:99px;border:0;background:#cbd5e1;cursor:pointer}
.kqd-dot.is-active{background:#64748b}

@media (min-width: 900px){.kqd-campaign-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.kqd-campaign-title{text-decoration:none;display:block}
.kqd-campaign-title:hover{text-decoration:underline}


/* Slider: no load more */
.kqd-type-slider .kqd-campaign-more{display:none!important;}


/* ===== Campaign Carousel (Slider) ===== */
.kqd-type-slider .kqd-carousel{position:relative; width:100%; overflow:hidden; padding:8px 2px 10px;}
.kqd-type-slider .kqd-carousel-track{
  display:flex;
  align-items:stretch;
  will-change:transform;
  transform:translate3d(0,0,0);
}
.kqd-type-slider .kqd-carousel-track.is-animating{transition:transform 420ms ease;}
.kqd-type-slider .kqd-carousel-slide{flex:0 0 auto;}
.kqd-type-slider .kqd-carousel-pagination{
  display:flex;
  justify-content:center;
  gap:8px;
  padding:10px 0 2px;
}
.kqd-type-slider .kqd-dot{
  width:10px;height:10px;border-radius:999px;
  border:0; background:#d6dbe3; cursor:pointer; padding:0;
}
.kqd-type-slider .kqd-dot.is-active{background:#6b778c;}
/* Slider: no load more */
.kqd-type-slider .kqd-campaign-more{display:none!important;}

.kqd-type-slider .kqd-carousel{touch-action: pan-y;}


/* === v1.7.2 cover no-crop (any aspect ratio, no cutting) === */
.kqd-donasiaja .kqd-section-image{
  position: relative;
  overflow: hidden;
  border-radius: 0;
  background: #f2fbfd;
  /* Keep a consistent hero area so tall images don't push content too far */
  aspect-ratio: 16 / 9;
}
@media (max-width: 520px){
  .kqd-donasiaja .kqd-section-image{ aspect-ratio: 4 / 3; }
}
.kqd-donasiaja .kqd-section-image img.kqd-parallax,
.kqd-donasiaja .kqd-section-image img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 !important;
  transform: none !important; /* prevent parallax scaling/cropping */
}
.kqd-donasiaja .parallax-wrapper{ height: auto !important; overflow: hidden !important; }


/* === v1.7.3 cover no-crop strong (show full image, never cut) === */
/* Works for both our class and legacy class */
body.kqd-donasiaja .kqd-section-image,
body.kqd-donasiaja .section-image{
  position: relative !important;
  overflow: hidden !important;
  background: #f2fbfd !important;
  aspect-ratio: auto !important;   /* remove fixed ratio that could imply crop */
  height: auto !important;
}
body.kqd-donasiaja .kqd-section-image img,
body.kqd-donasiaja .section-image img,
body.kqd-donasiaja .kqd-section-image img.kqd-parallax,
body.kqd-donasiaja .section-image img.kqd-parallax{
  width: 100% !important;
  height: auto !important;         /* key: image defines height -> no crop */
  max-height: none !important;
  object-fit: unset !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 !important;
  transform: none !important;
}
body.kqd-donasiaja .parallax-wrapper{
  height: auto !important;
  overflow: hidden !important;
}


/* Fallback if theme strips body classes */
.kqd-donasiaja-wrap .kqd-section-image,
.kqd-donasiaja-wrap .section-image{
  position:relative !important;
  overflow:hidden !important;
  background:#f2fbfd !important;
  height:auto !important;
  aspect-ratio:auto !important;
}
.kqd-donasiaja-wrap .kqd-section-image img,
.kqd-donasiaja-wrap .section-image img{width:100% !important;height:auto !important;transform:none !important;object-fit:unset !important;}


/* === v1.7.4 cover overflow visible + full image source === */
body.kqd-donasiaja .kqd-section-image,
.kqd-donasiaja-wrap .kqd-section-image{
  overflow: visible !important; /* ensure no cropping even if height is constrained */
}
