html {
  font-size: 14px;
}

:root {
  --sidebar-width: 244px;
  --sidebar-collapsed-width: 70px;
  --top-navbar-height: 66px;
}

.top-navbar {
  height: var(--top-navbar-height);
}

.navbar-content {
  min-height: var(--top-navbar-height);
}

.sidebar-header {
  height: var(--top-navbar-height);
  padding: .7rem .9rem;
}

.sidebar-nav {
  height: calc(100vh - var(--top-navbar-height));
}

.sidebar-brand-icon {
  width: 112px;
  height: 40px;
}

.sidebar.collapsed .sidebar-header {
  justify-content: center;
  gap: 3px;
  padding: 6px 4px;
}

.sidebar.collapsed .sidebar-title {
  width: auto;
  flex: 0 0 auto;
}

.sidebar.collapsed .sidebar-title-link {
  width: 31px;
  justify-content: center;
}

.sidebar.collapsed .sidebar-brand-icon {
  width: 31px;
  height: 31px;
}

.sidebar.collapsed .sidebar-toggle-btn {
  width: 25px;
  height: 34px;
  flex: 0 0 25px;
  padding: 2px;
  font-size: .9rem;
}

.nav-menu-toggle,
.sidebar .nav-link {
  min-height: 40px;
  padding: .6rem .75rem;
}

.page-content {
  padding: .75rem clamp(.85rem, 2vw, 1.6rem) 1.5rem;
}

.page-content .card-body {
  padding: clamp(.85rem, 1.6vw, 1.25rem);
}

.page-content .card-header,
.page-content .card-footer {
  padding: .8rem 1rem;
}

.page-content .table > :not(caption) > * > * {
  padding: .65rem .7rem;
}

.page-content .form-control,
.page-content .form-select,
.page-content .input-group-text,
.page-content .select2-container--bootstrap-5 .select2-selection {
  min-height: 40px;
}

.page-content .btn {
  min-height: 36px;
  padding: .42rem .75rem;
}

.theme-toggle-btn,
.sidebar-toggle-mobile {
  width: 38px;
  height: 38px;
}

@media (max-width: 767.98px) {
  html {
    font-size: 13.5px;
  }

  :root {
    --sidebar-width: 238px;
    --top-navbar-height: 60px;
  }

  .top-navbar,
  .navbar-content {
    min-height: var(--top-navbar-height);
    height: var(--top-navbar-height);
  }

  .page-content {
    padding: .65rem;
  }
}