:root {
  --hkss-apple-font: Inter, "Noto Sans TC", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", system-ui, sans-serif;
  --hkss-apple-bg: #f5f5f7;
  --hkss-apple-text: #1d1d1f;
  --hkss-apple-muted: #424245;
  --hkss-apple-nav-bg: rgba(245, 245, 247, 0.86);
  --hkss-apple-nav-border: rgba(0, 0, 0, 0.06);
  --bs-font-sans-serif: var(--hkss-apple-font);
  --bs-body-font-family: var(--hkss-apple-font);
  --bs-body-bg: var(--hkss-apple-bg);
}

html,
body {
  font-family: var(--hkss-apple-font);
  background-color: var(--hkss-apple-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

.layout-wrapper,
.layout-container,
.layout-page,
.content-wrapper {
  background-color: var(--hkss-apple-bg) !important;
}

button,
input,
select,
textarea,
.btn,
.dropdown-menu,
.navbar,
.menu,
.card,
.modal {
  font-family: var(--hkss-apple-font);
}

.layout-navbar.bg-navbar-theme {
  background-color: var(--hkss-apple-nav-bg) !important;
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
  border-bottom: 1px solid var(--hkss-apple-nav-border);
  box-shadow: none;
  color: var(--hkss-apple-text);
}

.layout-navbar.navbar-detached.bg-navbar-theme {
  background-color: var(--hkss-apple-nav-bg) !important;
  border: 1px solid var(--hkss-apple-nav-border);
  box-shadow: none;
  color: var(--hkss-apple-text);
}

.layout-navbar .navbar-nav .nav-link,
.layout-navbar .menu-link,
.layout-navbar .dropdown-toggle {
  color: var(--hkss-apple-muted) !important;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.35;
}

.layout-navbar .navbar-nav .nav-link:hover,
.layout-navbar .navbar-nav .nav-link:focus,
.layout-navbar .menu-link:hover,
.layout-navbar .menu-link:focus,
.layout-navbar .dropdown-toggle:hover,
.layout-navbar .dropdown-toggle:focus {
  color: var(--hkss-apple-text) !important;
}

.layout-navbar .navbar-nav .nav-link.active,
.layout-navbar .navbar-nav .show > .nav-link,
.layout-navbar .navbar-nav .nav-link[aria-expanded="true"] {
  color: var(--hkss-apple-text) !important;
  font-weight: 600;
}

.layout-navbar .navbar-nav.ms-auto .nav-link,
.layout-navbar .navbar-nav.ms-auto .dropdown-toggle,
.layout-navbar .btn {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.layout-navbar .dropdown-menu {
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  backdrop-filter: saturate(180%) blur(16px);
  background-color: rgba(255, 255, 255, 0.94);
  border-color: var(--hkss-apple-nav-border);
  color: var(--hkss-apple-text);
}

.layout-navbar .dropdown-menu .dropdown-item {
  color: var(--hkss-apple-text);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
}

.layout-navbar .dropdown-menu .dropdown-item:hover,
.layout-navbar .dropdown-menu .dropdown-item:focus {
  background-color: var(--hkss-apple-bg);
  color: var(--hkss-apple-text);
}

.dark-style .layout-navbar.bg-navbar-theme {
  background-color: rgba(49, 50, 73, 0.6) !important;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.dark-style .layout-navbar.navbar-detached.bg-navbar-theme {
  background-color: rgba(49, 50, 73, 0.66) !important;
  border-color: rgba(255, 255, 255, 0.08);
}

.dark-style .layout-navbar .dropdown-menu {
  background-color: rgba(49, 50, 73, 0.86);
}