:root { 
  --primary: #1aa34a; 
  --accent: #ef4444; 
}

body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: #f8fafc;
  color: #0f172a;
}

.navbar-brand img{ height:40px; }

.btn-primary{ 
  background-color: var(--primary); 
  border-color: var(--primary);
}
.btn-primary:hover{ 
  filter: brightness(0.95);
}

.badge-status{ background: var(--primary); }

.timeline{
  position: relative; 
  padding-left: 1.5rem; 
  margin-top: .5rem;
}
.timeline::before{
  content:""; 
  position:absolute; 
  left:10px; top:0; bottom:0; 
  width:2px; 
  background:#e2e8f0;
}
.timeline-item{
  position:relative; 
  margin:0 0 1rem 0; 
  padding-left:1rem;
}
.timeline-item::before{
  content:""; 
  position:absolute; 
  left:-.2rem; 
  top:.3rem; 
  width:12px; 
  height:12px; 
  border-radius:50%; 
  background:var(--primary);
}

.card{
  border: 1px solid #e2e8f0; 
  border-radius: 16px; 
  overflow: hidden; 
  box-shadow: 0 6px 14px rgba(0,0,0,.04);
}

.hero {
  background: linear-gradient(135deg, rgba(26,163,74,.08), rgba(239,68,68,.05));
  border-bottom: 1px solid #e2e8f0;
}

footer{
  margin-top: 3rem; 
  padding: 2rem 0; 
  color:#475569; 
  background:#fff; 
  border-top:1px solid #e2e8f0;
}

.table img.thumb{ 
  height:48px; 
  border-radius:8px; 
}

.form-control, .form-select{ 
  border-radius:12px; 
}

/* =========================
   FIX SCROLL MODAL FORM
   ========================= */
.modal {
  max-height: 90vh;         
  overflow-y: auto;         
}

.modal-body {
  max-height: 70vh;         
  overflow-y: auto;         
  padding-right: 10px;      
}

/* =========================
   BUTTON STYLE (HIJAU)
   ========================= */
.btn-primary {
  background-color: var(--primary) !important; 
  border-color: var(--primary) !important;
  color: #fff !important;
  border-radius: 12px;
  padding: 0.6rem 1.2rem;
  font-weight: 600;
  transition: all 0.2s ease;
}

.btn-primary:hover {
  background-color: #15803d !important; 
  border-color: #15803d !important;
  filter: none !important;
}

.modal {
  max-height: 90vh; /* supaya tidak melebihi layar */
  overflow-y: auto; /* bisa discroll */
}
