:root{
  --brand-orange:#E87820;
  --brand-orange-dark:#c8650f;
  --brand-charcoal:#2b2f32;
  --purple-1:#6C4CF1;
  --purple-2:#8B5CF6;
  --bg:#f5f6f8;
  --border:#e9ebee;
  --muted:#8a919b;
  --green:#1aa053;
  --green-bg:#e8f8ee;
  --red:#e14b4b;
  --red-bg:#fdeaea;
  --amber:#e8930f;
  --amber-bg:#fdf1de;
  --blue:#2f6fed;
  --blue-bg:#eaf1fe;
}
*{font-family:'Inter',sans-serif;}
body{background:var(--bg);color:var(--brand-charcoal);}
.breadcrumb-wrap{font-size:.82rem;color:var(--muted);}
.breadcrumb-wrap a{color:var(--muted);text-decoration:none;}
.breadcrumb-wrap a:hover{color:var(--brand-orange);}
.page-title{font-weight:800;font-size:1.35rem;color:var(--brand-charcoal);}

.card-soft{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
}

/* Hero available coins card */
.hero-coins{
  background:linear-gradient(135deg,var(--purple-1),var(--purple-2));
  border-radius:14px;
  color:#fff;
  padding:1.25rem 1.4rem;
  position:relative;
  overflow:hidden;
  height:100%;
}
.hero-coins::after{
  content:"";
  position:absolute;
  right:-30px;top:-30px;
  width:140px;height:140px;
  background:rgba(255,255,255,.08);
  border-radius:50%;
}
.coin-icon-badge{
  width:44px;height:44px;
  background:#f2b134;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;
  color:#a5620a;
  box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.hero-label{font-size:.78rem;opacity:.85;}
.hero-value{font-size:1.9rem;font-weight:800;line-height:1.1;}
.hero-sub{font-size:.75rem;opacity:.85;}
.btn-view-catalog{
  background:#fff;color:var(--purple-1);
  font-weight:600;font-size:.82rem;
  border-radius:8px;border:none;
  padding:.4rem 1rem;
}
.btn-view-catalog:hover{background:#f3f0ff;color:var(--purple-1);}

/* small stat cards */
.stat-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:1.1rem 1.2rem;
  height:100%;
}
.stat-icon{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;flex-shrink:0;
}
.stat-icon.green{background:var(--green-bg);color:var(--green);}
.stat-icon.red{background:var(--red-bg);color:var(--red);}
.stat-icon.amber{background:var(--amber-bg);color:var(--amber);}
.stat-icon.blue{background:var(--blue-bg);color:var(--blue);}
.stat-label{font-size:.75rem;color:var(--muted);}
.stat-value{font-size:1.3rem;font-weight:800;color:var(--brand-charcoal);}
.info-icon{font-size:.7rem;color:var(--muted);cursor:pointer;}

/* info + summary strip */
.info-block h6{font-weight:700;font-size:.9rem;margin-bottom:.4rem;}
.info-block p{font-size:.82rem;color:var(--muted);margin-bottom:.4rem;}
.info-block a{font-size:.82rem;color:var(--brand-orange);font-weight:600;text-decoration:none;}
.info-block a:hover{text-decoration:underline;}
.summary-line{font-size:.85rem;color:var(--brand-charcoal);margin-bottom:.35rem;font-weight:500;}
.wallet-illustration{width:90px;height:90px;flex-shrink:0;}

/* tabs */
.coin-tabs{border-bottom:1px solid var(--border);}
.coin-tabs .nav-link{
  color:var(--muted);
  font-weight:600;
  font-size:.88rem;
  border:none;
  padding:.7rem .25rem;
  margin-right:1.6rem;
  border-radius:0;
  position:relative;
}
.coin-tabs .nav-link.active{
  color:var(--brand-orange);
  background:transparent;
}
.coin-tabs .nav-link.active::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;
  background:var(--brand-orange);
  border-radius:2px;
}

/* filter row */
.filter-bar .form-select,
.filter-bar .form-control{
  font-size:.82rem;
  border-radius:8px;
  border:1px solid var(--border);
  background:#fff;
}
.filter-bar .input-search{position:relative;}
.filter-bar .input-search i{
  position:absolute;left:.7rem;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:.85rem;
}
.filter-bar .input-search input{padding-left:2rem;}
.btn-outline-soft{
  border:1px solid var(--border);
  background:#fff;
  color:var(--brand-charcoal);
  font-size:.82rem;
  font-weight:600;
  border-radius:8px;
}
.btn-outline-soft:hover{background:#f8f9fa;}

/* table */
.table-coins thead th{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:var(--muted);
  font-weight:700;
  background:#fafbfc;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.table-coins tbody td{
  font-size:.83rem;
  vertical-align:middle;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.table-coins tbody tr:last-child td{border-bottom:none;}
.badge-type{
  font-size:.72rem;font-weight:600;
  padding:.3rem .6rem;border-radius:20px;
}
.badge-earned{background:var(--green-bg);color:var(--green);}
.badge-redeemed{background:var(--red-bg);color:var(--red);}
.badge-expired{background:var(--amber-bg);color:var(--amber);}
.badge-pending{background:var(--blue-bg);color:var(--blue);}
.coins-pos{color:var(--green);font-weight:700;}
.coins-neg{color:var(--red);font-weight:700;}
.status-pill{
  font-size:.72rem;font-weight:600;
  padding:.3rem .65rem;border-radius:20px;
}
.status-credited{background:var(--green-bg);color:var(--green);}
.status-completed{background:var(--blue-bg);color:var(--blue);}
.status-expired{background:#f1f1f3;color:var(--muted);}

/* mobile cards */
.txn-card{
  border:1px solid var(--border);
  border-radius:12px;
  padding:.9rem 1rem;
  margin-bottom:.7rem;
  background:#fff;
}
.txn-card .txn-top{display:flex;justify-content:space-between;align-items:flex-start;}
.txn-card .txn-date{font-size:.72rem;color:var(--muted);}
.txn-card .txn-desc{font-weight:600;font-size:.87rem;margin:.2rem 0;}
.txn-card .txn-ref{font-size:.75rem;color:var(--muted);}
.txn-card .txn-coins{font-size:1rem;font-weight:800;}

/* pagination */
.pg-btn{
  width:32px;height:32px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:.82rem;color:var(--brand-charcoal);
  cursor:pointer;
}
.pg-btn.active{background:var(--brand-orange);border-color:var(--brand-orange);color:#fff;}
.pg-btn:disabled{opacity:.5;cursor:not-allowed;}
.entries-text{font-size:.8rem;color:var(--muted);}
.per-page-select{
  font-size:.82rem;border-radius:8px;border:1px solid var(--border);
}

@media (max-width:767px){
  .hero-value{font-size:1.6rem;}
  .page-title{font-size:1.15rem;}
}