/* AsteraMedika brand theme — palet warna resmi (diselaraskan dari preview.asteramedika.id) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

:root {
  --am-navy: #0B2D4D;
  --am-teal: #0EA5A7;
  --am-teal-bright: #17C3B2;
  --am-aqua: #7EE7DE;
  --am-mint: #E6FAF8;
  --am-ice: #F7FEFD;
  --am-gray: #5b6b7a;
  --am-card-radius: 1.25rem;
  --am-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --am-header-bg: #ffffff;
  --am-header-bg-active: #0b8f91;
  --am-page-bg: var(--am-ice);

  /* Override Velzon purple → Astera teal */
  --vz-primary: #0EA5A7;
  --vz-primary-rgb: 14, 165, 167;
  --vz-primary-text-emphasis: #0B2D4D;
  --vz-primary-bg-subtle: #E6FAF8;
  --vz-primary-border-subtle: #7EE7DE;
  --vz-topnav-item-active-color: #0EA5A7;
  --vz-vertical-menu-item-hover-color: #0EA5A7;
  --vz-vertical-menu-item-active-color: #0EA5A7;
  --vz-header-bg: #ffffff;
  --vz-header-item-color: #0B2D4D;
}

body {
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: var(--am-page-bg) url('background.png') center top / cover no-repeat fixed;
}

.am-brand-bg,
body.am-app-body {
  background: var(--am-page-bg) url('background.png') center top / cover no-repeat fixed;
}

/* Header / topbar — background putih */
#page-topbar,
#page-topbar .layout-width,
#page-topbar .navbar-header,
#page-topbar .navbar-brand-box,
#page-topbar .topbar-user,
#page-topbar .topbar-user .btn,
#page-topbar .header-item,
#page-topbar .header-item > .btn,
#page-topbar .dropdown.topbar-head-dropdown > .btn {
  background-color: #ffffff !important;
}

#page-topbar {
  border-bottom: 1px solid rgba(11, 45, 77, 0.08);
  box-shadow: 0 1px 4px rgba(11, 45, 77, 0.04);
}

#page-topbar .header-item .btn-topbar,
#page-topbar .header-item i,
#page-topbar .topbar-user .user-name-text,
#page-topbar .topbar-user .user-name-sub-text,
#page-topbar .topnav-hamburger .hamburger-icon span {
  color: var(--am-navy) !important;
}

#page-topbar .app-search .form-control {
  background-color: #f3f6f9 !important;
  border-color: rgba(11, 45, 77, 0.12) !important;
  color: var(--am-navy) !important;
}

#page-topbar .app-search .form-control::placeholder {
  color: var(--am-gray) !important;
}

#page-topbar .app-search .search-widget-icon {
  color: var(--am-gray) !important;
}

#page-topbar .topbar-user {
  border-left: 1px solid rgba(11, 45, 77, 0.1);
}

#page-topbar .navbar-brand-box .logo-light {
  display: none !important;
}

#page-topbar .navbar-brand-box .logo-dark {
  display: inline-block !important;
}

#page-topbar .navbar-header {
  min-height: 70px !important;
  height: 70px !important;
}

#page-topbar .navbar-brand-box.horizontal-logo {
  height: 70px !important;
  display: flex;
  align-items: center;
}

#page-topbar .navbar-brand-box.horizontal-logo .logo-lg img {
  height: 48px !important;
  width: auto;
  max-height: 48px !important;
}

#page-topbar .navbar-brand-box.horizontal-logo .logo-sm img {
  height: 34px !important;
  width: auto;
  max-height: 34px !important;
}

.main-content,
.page-content {
  background: transparent;
}

body.am-app-body .page-content {
  min-height: calc(100vh - 70px);
}

.btn-primary {
  background-color: var(--am-teal) !important;
  border-color: var(--am-teal) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-check:checked + .btn-primary {
  background-color: var(--am-teal-bright) !important;
  border-color: var(--am-teal-bright) !important;
}

.btn-soft-primary {
  color: var(--am-teal) !important;
  background-color: rgba(14, 165, 167, 0.12) !important;
  border-color: transparent !important;
}

.btn-soft-primary:hover,
.btn-soft-primary:focus {
  color: #fff !important;
  background-color: var(--am-teal) !important;
}

.bg-primary {
  background-color: var(--am-teal) !important;
}

.text-primary {
  color: var(--am-teal) !important;
}

a {
  color: var(--am-teal);
}

a:hover {
  color: var(--am-teal-bright);
}

.card {
  border-color: rgba(14, 165, 167, 0.12);
  box-shadow: 0 8px 28px rgba(11, 45, 77, 0.06);
}

.card-header {
  background: linear-gradient(180deg, var(--am-mint) 0%, #fff 100%);
  border-bottom-color: rgba(14, 165, 167, 0.12);
  color: var(--am-navy);
}

.footer {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(6px);
  border-top: 1px solid rgba(14, 165, 167, 0.12);
  color: var(--am-navy);
}

.navbar-menu {
  background: #fff !important;
  border-bottom: 1px solid rgba(14, 165, 167, 0.12);
  box-shadow: 0 4px 18px rgba(11, 45, 77, 0.04);
}

.navbar-menu .navbar-nav .nav-link {
  color: var(--am-navy) !important;
  font-weight: 500;
}

.navbar-menu .navbar-nav .nav-link:hover,
.navbar-menu .navbar-nav .nav-link:focus {
  color: var(--am-teal) !important;
}

.navbar-menu .navbar-nav .nav-item.active > .nav-link,
.navbar-menu .navbar-nav .nav-link.active {
  background: transparent !important;
  color: var(--am-teal) !important;
  border-radius: 0;
}

.navbar-menu .menu-dropdown .nav-link {
  color: var(--am-navy) !important;
}

.navbar-menu .menu-dropdown .nav-link:hover {
  color: var(--am-teal) !important;
  background: var(--am-mint);
}

body.am-auth-body {
  background: #F7FEFD url('background.png') center center / cover no-repeat fixed;
  min-height: 100vh;
}

.auth-page-wrapper.auth-bg-cover {
  background: #F7FEFD url('background.png') center center / cover no-repeat fixed !important;
}

.auth-page-wrapper.auth-bg-cover > .bg-overlay {
  opacity: 0 !important;
  background: transparent !important;
  background-image: none !important;
}

.btn.am-btn-submit {
  background: linear-gradient(135deg, #0EA5A7 0%, #17C3B2 100%) !important;
  border: none !important;
  color: #fff !important;
}

.btn.am-btn-submit:hover,
.btn.am-btn-submit:focus {
  background: linear-gradient(135deg, #17C3B2 0%, #0EA5A7 100%) !important;
  color: #fff !important;
}