/* ASIA-FLASH unified visual theme: charcoal, white, and yellow */
:root {
  --af-ink: #17191f;
  --af-blue: #17191f;
  --af-blue-dark: #0f1014;
  --af-yellow: #ffd42a;
  --af-muted: #737987;
  --af-bg: #f5f6f8;
  --af-card: #ffffff;
  --af-border: #e7e9ee;
  --af-radius: 16px;
}
html { scroll-behavior: smooth; }
body { background: var(--af-bg); color: var(--af-ink); font-family: Inter, "Segoe UI", Arial, sans-serif; }
a { transition: color .18s ease, background-color .18s ease, border-color .18s ease; }
.navbar.sticky-top { background: #17191f !important; color: #fff; border-bottom: 1px solid rgba(255,255,255,.08); box-shadow: 0 5px 24px rgba(0,0,0,.08); }
.navbar .navbar-brand { color: #fff !important; font-weight: 850; letter-spacing: .04em; }
.navbar .nav-link { border-radius: 10px; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: var(--af-yellow) !important; }
.navbar-toggler { border-color: rgba(255,255,255,.3) !important; }
.nav-pills.fixed-bottom { background: #17191f !important; padding: 7px 8px max(7px, env(safe-area-inset-bottom)); box-shadow: 0 -8px 24px rgba(0,0,0,.12); }
.nav-pills.fixed-bottom .nav-link { color: #c8cbd2 !important; margin: 0 2px; border-radius: 11px; padding: 10px 5px; }
.nav-pills.fixed-bottom .nav-link:hover, .nav-pills.fixed-bottom .nav-link.aktif, .nav-pills.fixed-bottom .nav-link[aria-current="page"] { background: var(--af-yellow) !important; color: #17191f !important; }
.btn { border-radius: 10px; font-weight: 700; transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary, .btn-success { background: var(--af-yellow) !important; color: #17191f !important; border-color: var(--af-yellow) !important; }
.btn-primary:hover, .btn-success:hover { background: #f0c000 !important; border-color: #f0c000 !important; }
.btn-warning { background: var(--af-yellow) !important; color: #17191f !important; border-color: var(--af-yellow) !important; }
.btn-outline-primary { color: #17191f !important; border-color: #d4b21f !important; }
.btn-outline-primary:hover { background: var(--af-yellow) !important; }
.form-control, .form-select { min-height: 43px; border: 1px solid #dfe2e8; border-radius: 10px; background-color: #fff; }
.form-control:focus, .form-select:focus { border-color: #e3bd16; box-shadow: 0 0 0 .22rem rgba(255,212,42,.22); }
.form-check-input:checked { background-color: #17191f; border-color: #17191f; }
.card, .modal-content, .offcanvas, .dropdown-menu { border: 1px solid var(--af-border); border-radius: var(--af-radius); box-shadow: 0 12px 32px rgba(23,25,31,.06); }
.card-header, .modal-header { border-bottom-color: var(--af-border); }
.table { --bs-table-bg: #fff; --bs-table-striped-bg: #f8f9fb; vertical-align: middle; }
.table thead th { background: #17191f !important; color: #fff !important; border-color: #363941 !important; white-space: nowrap; }
.table-bordered > :not(caption) > * > * { border-color: #e7e9ee; }
.table-responsive { border-radius: 14px; }
.bg-success-subtle, .bg-info-subtle { background-color: #fff !important; }
section.bg-info, section.bg-primary, section[style*="background-color: #4491F8"] { background: #17191f !important; }
section.bg-info, section.bg-primary { color: #fff; }
.badge { border-radius: 7px; padding: .45em .65em; }
.alert { border: 0; border-radius: 12px; }
.container > .rounded-3.shadow-lg, .container > .rounded.shadow-lg { border: 1px solid var(--af-border); box-shadow: 0 12px 32px rgba(23,25,31,.06) !important; }
hr { opacity: .14; }
footer { color: #737987; }
/* Homepage brand components */
.af-navbar { background: rgba(23,25,31,.97) !important; }
.af-hero { background: #17191f !important; }
.af-hero h1 span, .af-eyebrow, .af-brand-mark { color: var(--af-yellow); }
.af-brand-mark { background: var(--af-yellow); color: #17191f; }
.af-btn-primary, .af-nav-cta { background: var(--af-yellow) !important; color: #17191f !important; border-color: var(--af-yellow) !important; }
.af-btn-outline { border-color: rgba(255,255,255,.45); }
/* Login and public information pages */
#login .container { max-width: 960px; border: 1px solid var(--af-border); border-radius: 22px; box-shadow: 0 18px 48px rgba(23,25,31,.08); }
#login h1 { font-family: Inter, "Segoe UI", Arial, sans-serif !important; color: #17191f; }
#form-Cashier .container, #form-admin .container { background: #fff !important; border: 1px solid var(--af-border); }
@media (max-width: 767.98px) {
  body { font-size: 14px; }
  .container { --bs-gutter-x: 1.25rem; }
  #login .container { margin-top: 1rem !important; margin-bottom: 1rem !important; padding: 1.25rem !important; }
  #login h1 { width: 100%; max-width: 100%; }
  .table { font-size: .82rem; }
  .navbar .container { gap: .5rem; }
  .nav-pills.fixed-bottom .nav-link { font-size: .9rem; }
}
@media print {
  body { background: #fff !important; }
  .navbar, .fixed-bottom, .noPrint { display: none !important; }
  .card, .container { box-shadow: none !important; }
}