/* ============================================================
   SINGGIH — Global CSS
   Kabupaten Mukomuko
   ============================================================ */

:root {
  --primary:       #1F4E79;
  --primary-mid:   #2E75B6;
  --primary-lt:    #BDD7EE;
  --primary-pale:  #DEEAF1;
  --accent:        #ED7D31;
  --success:       #375623;
  --success-lt:    #E2EFDA;
  --warning:       #7F6000;
  --warning-lt:    #FFF2CC;
  --danger:        #C00000;
  --danger-lt:     #FFE0E0;
  --gray-text:     #595959;
  --gray-light:    #F2F2F2;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Resets & base */
*, *::before, *::after { box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; }

/* Scrollbar styling */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: var(--primary-lt); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--primary-mid); }

/* ---- Form Components ---- */
.input {
  display: block;
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid #D1D5DB;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-family: 'Inter', sans-serif;
  transition: border-color 0.15s, box-shadow 0.15s;
  background: #fff;
  color: #374151;
}
.input:focus {
  outline: none;
  border-color: var(--primary-mid);
  box-shadow: 0 0 0 3px rgba(46,117,182,0.15);
}
.input:disabled { background: #F9FAFB; color: #9CA3AF; cursor: not-allowed; }

.label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 0.375rem;
}

/* ---- Buttons ---- */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.25rem;
  background: var(--primary);
  color: #fff;
  border-radius: 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background 0.15s, transform 0.1s, box-shadow 0.15s;
  text-decoration: none;
}
.btn-primary:hover  { background: var(--primary-mid); box-shadow: 0 4px 12px rgba(31,78,121,0.3); }
.btn-primary:active { transform: scale(0.97); }

.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.25rem;
  border: 1.5px solid #D1D5DB;
  color: #6B7280;
  border-radius: 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
  text-decoration: none;
}
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }

/* ---- Badges ---- */
.badge-success  { display:inline-block; padding: 0.125rem 0.625rem; background:#E2EFDA; color:#375623; border-radius:9999px; font-size:0.75rem; font-weight:600; }
.badge-warning  { display:inline-block; padding: 0.125rem 0.625rem; background:#FFF2CC; color:#7F6000; border-radius:9999px; font-size:0.75rem; font-weight:600; }
.badge-danger   { display:inline-block; padding: 0.125rem 0.625rem; background:#FFE0E0; color:#C00000; border-radius:9999px; font-size:0.75rem; font-weight:600; }
.badge-info     { display:inline-block; padding: 0.125rem 0.625rem; background:#DEEAF1; color:#1F4E79; border-radius:9999px; font-size:0.75rem; font-weight:600; }

/* ---- Animations ---- */
@keyframes fadeInDown {
  from { opacity:0; transform: translateY(-12px); }
  to   { opacity:1; transform: translateY(0); }
}
@keyframes slideIn {
  from { opacity:0; transform: translateX(20px); }
  to   { opacity:1; transform: translateX(0); }
}

.animate-toast { animation: slideIn 0.3s ease-out; }
.animate-fade  { animation: fadeInDown 0.3s ease-out; }

/* Toast auto-hide */
#toast-success, #toast-error {
  animation: slideIn 0.3s ease-out;
}

/* Line clamp utilities */
.line-clamp-1 { display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* Table responsive */
@media (max-width: 768px) {
  .table-responsive { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Print styles */
@media print {
  aside, header, footer, button, .no-print { display: none !important; }
  body { background: white; }
  .lg\\:pl-64 { padding-left: 0 !important; }
}