/* =========================================
   ScanPay Theme: Deep Green + Mint Accent
   Works across all pages (admin + public)
   ========================================= */

:root{
  /* Brand */
  --sp-green-950:#052e22;
  --sp-green-900:#064e3b;   /* primary deep green */
  --sp-green-800:#065f46;   /* hover / secondary */
  --sp-mint-500:#10b981;    /* mint accent */
  --sp-mint-400:#34d399;

  /* UI */
  --sp-ink:#0f172a;
  --sp-muted:#64748b;
  --sp-bg:#f3f7f6;          /* subtle green tint */
  --sp-card:#ffffff;
  --sp-border:#e5e7eb;

  --sp-shadow: 0 10px 30px rgba(2,6,23,.08);
  --sp-shadow-sm: 0 6px 18px rgba(2,6,23,.06);

  --sp-radius: 18px;
  --sp-radius-sm: 14px;

  /* Focus ring */
  --sp-focus: 0 0 0 .25rem rgba(16,185,129,.16);
}

/* Base */
html, body{ height:100%; }
body{
  background: var(--sp-bg);
  color: var(--sp-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a{ color: var(--sp-green-900); }
a:hover{ color: var(--sp-green-800); }

.text-muted{ color: var(--sp-muted) !important; }

/* Headings */
h1,h2,h3,h4,h5,h6{ letter-spacing:-0.02em; }

/* Cards */
.card{
  background: var(--sp-card);
  border: 1px solid var(--sp-border);
  border-radius: var(--sp-radius);
  box-shadow: var(--sp-shadow);
}
.card-header{
  background: transparent;
  border-bottom: 1px solid var(--sp-border);
}

/* Buttons */
.btn{
  border-radius: var(--sp-radius-sm);
  padding: .62rem 1rem;
  font-weight: 650;
  letter-spacing: .01em;
}
.btn:focus{ box-shadow: var(--sp-focus) !important; }

.btn-success, .btn-primary{
  background: var(--sp-green-900);
  border-color: var(--sp-green-900);
}
.btn-success:hover, .btn-primary:hover{
  background: var(--sp-green-800);
  border-color: var(--sp-green-800);
}
.btn-success:active, .btn-primary:active{
  background: #054735;
  border-color: #054735;
}

.btn-outline-primary{
  border-color: rgba(6,95,70,.35);
  color: var(--sp-green-900);
}
.btn-outline-primary:hover{
  background: rgba(16,185,129,.10);
  border-color: rgba(6,95,70,.55);
  color: var(--sp-green-900);
}

.btn-outline-secondary{
  border-color: rgba(100,116,139,.35);
}

/* Forms */
.form-control, .form-select{
  border-radius: var(--sp-radius-sm);
  border-color: var(--sp-border);
  padding: .65rem .95rem;
}
.form-control::placeholder{ color: rgba(100,116,139,.7); }
.form-control:focus, .form-select:focus{
  border-color: rgba(16,185,129,.65);
  box-shadow: var(--sp-focus);
}

/* Tables */
.table{ margin-bottom:0; }
.table thead th{
  color: #0f3d2e;
  font-weight: 800;
  border-bottom: 1px solid var(--sp-border);
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: .06em;
}
.table td, .table th{ border-color: var(--sp-border); }
.table-hover tbody tr:hover{ background: rgba(16,185,129,.06); }

/* Badges */
.badge{
  border-radius: 999px;
  padding: .45rem .6rem;
  font-weight: 800;
}
.text-bg-success{
  background-color: rgba(16,185,129,.18) !important;
  color: #064e3b !important;
}
.text-bg-danger{
  background-color: rgba(220,38,38,.14) !important;
  color: #7f1d1d !important;
}
.text-bg-secondary{
  background-color: rgba(100,116,139,.16) !important;
  color: #334155 !important;
}

/* Alerts */
.alert{
  border-radius: var(--sp-radius);
  border: 1px solid var(--sp-border);
}
.alert-success{
  background: rgba(16,185,129,.10);
  border-color: rgba(16,185,129,.22);
  color: #063b2d;
}
.alert-danger{
  background: rgba(220,38,38,.08);
  border-color: rgba(220,38,38,.18);
  color: #7f1d1d;
}

/* Sidebar (Admin) */
.sidebar{
  background: linear-gradient(180deg, var(--sp-green-950), var(--sp-green-900));
  border-right: 1px solid rgba(255,255,255,.08);
}
.sidebar a{
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.55rem .7rem;
  border-radius: 12px;
  color: rgba(255,255,255,.86);
  text-decoration:none;
  position: relative;
}
.sidebar a:hover{
  background: rgba(255,255,255,.08);
  color:#fff;
}
.sidebar a.active{
  background: rgba(255,255,255,.12);
  color:#fff;
}
.sidebar a.active::before{
  content:"";
  position:absolute;
  left:-10px;
  top:10px;
  bottom:10px;
  width:4px;
  border-radius:999px;
  background: var(--sp-mint-500);
}

/* Optional: Top stats cards look tighter */
.sp-stat{
  border-radius: var(--sp-radius);
  border: 1px solid var(--sp-border);
  box-shadow: var(--sp-shadow-sm);
}

/* Optional: small chips / pills */
.sp-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.35rem .6rem;
  border-radius: 999px;
  background: rgba(16,185,129,.10);
  color: #064e3b;
  border: 1px solid rgba(16,185,129,.18);
  font-weight: 700;
  font-size: .85rem;
}