/**
 * CSS Styles
 */

[data-bs-theme="light"] {

  --app-primary-color: #4154f1;
  --app-primary-color-rgb: 65, 84, 241;
  --app-primary-color-light: #5465f2;
  --app-primary-color-disabled: #b3bbf9;

  --app-secondary-color: #012970;
  --app-secondary-color-rgb: 1, 41, 112;
  --app-secondary-color-light: #013797;
  --app-secondary-color-disabled: #629afe;

  --app-light-color: #f6f9ff;

  --bs-body-color: #070b1a;
  --bs-secondary-color: #5a6a85;
  --bs-emphasis-color: #2a3547;
  --bs-heading-color: var(--bs-emphasis-color);
  --bs-primary-rgb: var(--app-primary-color-rgb);
  --bs-link-color-rgb: var(--app-primary-color-rgb);
  --bs-navbar-brand-color: var(--app-primary-color);

  --bs-primary-rgb: var(--app-primary-color-rgb);
  --bs-secondary-rgb: var(--app-secondary-color-rgb);
  --bs-font-sans-serif: Inter, sans-serif;
}

/**
 * Scroll bars
 */
@supports (scrollbar-width:thin) {
  body * {
    scrollbar-width: thin;
    scrollbar-color: #c6ccdc transparent
  }
}

/**
 * Buttons
 */

.btn {
  --bs-btn-font-weight: 500;
}

.btn-primary {
  --bs-btn-bg: var(--app-primary-color);
  --bs-btn-border-color: var(--app-primary-color);
  --bs-btn-hover-bg: var(--app-primary-color-light);
  --bs-btn-hover-border-color: var(--app-primary-color-light);
  --bs-btn-active-bg: var(--app-primary-color-light);
  --bs-btn-active-border-color: var(--app-primary-color-light);
  --bs-btn-disabled-bg: var(--app-primary-color-disabled);
  --bs-btn-disabled-border-color: var(--app-primary-color-disabled);
}

.btn-secondary {
  --bs-btn-bg: var(--app-secondary-color);
  --bs-btn-border-color: var(--app-secondary-color);
  --bs-btn-hover-bg: var(--app-secondary-color-light);
  --bs-btn-hover-border-color: var(--app-secondary-color-light);
  --bs-btn-active-bg: var(--app-secondary-color-light);
  --bs-btn-active-border-color: var(--app-secondary-color-light);
  --bs-btn-disabled-bg: var(--app-secondary-color-disabled);
  --bs-btn-disabled-border-color: var(--app-secondary-color-disabled);
}

.btn-outline-primary {
  --bs-btn-color: var(--app-primary-color);
  --bs-btn-border-color: var(--app-primary-color);
  --bs-btn-hover-bg: var(--app-primary-color-light);
  --bs-btn-hover-border-color: var(--app-primary-color-light);
  --bs-btn-active-bg: var(--app-primary-color);
  --bs-btn-active-border-color: var(--app-primary-color);
  --bs-btn-disabled-color: var(--app-primary-color-disabled);
  --bs-btn-disabled-border-color: var(--app-primary-color-disabled);
}

.btn-outline-secondary {
  --bs-btn-color: var(--app-secondary-color);
  --bs-btn-border-color: var(--app-secondary-color);
  --bs-btn-hover-bg: var(--app-secondary-color-light);
  --bs-btn-hover-border-color: var(--app-secondary-color-light);
  --bs-btn-active-bg: var(--app-secondary-color);
  --bs-btn-active-border-color: var(--app-secondary-color);
  --bs-btn-disabled-color: var(--app-secondary-color-disabled);
  --bs-btn-disabled-border-color: var(--app-secondary-color-disabled);
}

/**
 * Navs
 */

.navbar {
  --bs-navbar-active-color: var(--app-primary-color);
}

.nav,
.navbar-nav {
  --bs-nav-link-color: var(--app-secondary-color);
  --bs-nav-link-hover-color: var(--app-primary-color-light);
}

.nav-pills {
  --bs-nav-pills-link-active-bg: var(--app-primary-color);
}

/**
 * Dropdowns
 */

.dropdown-menu {
  /*--bs-dropdown-bg: white;*/
  --bs-dropdown-link-color: var(--app-secondary-color);
  --bs-dropdown-link-hover-color: var(--app-primary-color);
  min-width: 0;
}

.dropdown-item {
  font-weight: 500;
}

.dropdown-item i {
  margin-right: .5rem;
  opacity: .5;
}


/**
 * Forms
 */

label {
  color: var(--bs-secondary-color);
}

.required label::after {
  content: '*';
  margin-left: .25rem;
  color: var(--bs-danger);
  font-size: .9rem;
}

/**
 * Table
 */

.table {
  --bs-table-bg: white;
  margin-bottom: 0;
}

.table a {
  text-decoration: none;
}

.table th {
  --bs-table-color: var(--app-secondary-color);
  font-weight: 500;
}

.table th a {
  color: inherit;
}

.table a.asc::after {
  content: '🞁';
  margin-left: .25rem;
  opacity: .25;
  font-size: .875rem;
}

.table a.desc::after {
  content: '🞃';
  margin-left: .25rem;
  opacity: .25;
  font-size: .875rem;
}

.table td {
  vertical-align: middle;
}

.table .action,
.table .actions {
  width: 1%;
  text-align: right;
}

.table tbody tr:last-child td {
  border-bottom: none;
}

/**
 * Card
 */

.card {
  --bs-card-bg: #fff;  
  --bs-card-cap-bg: rgba(0, 0, 0, 0);
  --bs-card-border-width: 0;
  --bs-card-cap-padding-y: 1rem;
  --bs-card-color: var(--bs-emphasis-color);
  --bs-card-title-color: var(--bs-heading-color);
  --bs-card-subtitle-color: var(--bs-secondary-color);
  box-shadow: var(--bs-box-shadow-sm);
}

.card-footer {
  padding-top: 0;
}

/**
 * Breadcrumb
 */

.breadcrumb {
  --bs-breadcrumb-margin-bottom: 0;
  --bs-breadcrumb-divider: '🡒';
  --bs-breadcrumb-font-size: .9rem;
}

.breadcrumb-item a {
  text-decoration: none;
  color: var(--bs-secondary-color);
}

.breadcrumb-item + .breadcrumb-item::before {
  content: '';
  display: none;
}

.breadcrumb-item::after {
  padding-left: var(--bs-breadcrumb-item-padding-x);
  color: var(--bs-breadcrumb-divider-color);
  content: var(--bs-breadcrumb-divider);
}

/**
 * Definition list
 */

dl {
  margin-bottom: 0;
  --app-dt-width: 10rem;
}

dt {
  color: var(--bs-secondary-color);
  font-weight: 400;
}

dd {
  margin-bottom: 1rem;
}

dd > *::last-child {
  margin-bottom: 0;
}

@media (min-width: 567px) {

  dl {
    display: flex;
    flex-wrap: wrap;
  }

  dt {
    width: var(--app-dt-width);
    margin-bottom: 1rem;
    padding-right: 1rem;
  }

  dd {
    width: calc(100% - var(--app-dt-width));
  }
}

/**
 * Pagination
 */

.pagination {
  --bs-pagination-color: var(--app-primary-color);
  --bs-pagination-hover-color: var(--app-primary-color-light);
  --bs-pagination-focus-color: var(--app-primary-color-light);
  --bs-pagination-active-bg: var(--app-primary-color);
  --bs-pagination-active-border-color: var(--app-primary-color);
  margin-top: 1rem;
  margin-bottom: 0;
}

/**
 * Utilities
 */

.w-1 {
  width: 1%;
}

/**
 * Body
 */

html, 
body {
    height: 100%;
}

body {
  background-color: var(--app-light-color);
}

/**
 * Sidebar
 */

.sidebar .nav-link {
  font-weight: 500;
}

.sidebar .nav-link i {
  margin-right: .5rem;
  opacity: .5;
}

@media (min-width: 992px) {

  .sidebar {
    flex-shrink: 0;
    flex-grow: 0;
    position: sticky;
    width: 15rem;
    top: 3.5rem;
    height: calc(100vh - 4rem);
    overflow-y: auto;
  }
}

/**
 * Main content
 */

@media (min-width: 992px) {
    main {
        flex-grow: 1;
    }
}

/**
 * Page header
 */

.page-header .buttons .btn {
  margin-right: .5rem;
}

@media (min-width: 768px) {
  .page-header .buttons .btn {
    margin-left: .5rem;
    margin-right: 0;
  }
}


/**
 * Print
 */

@media print {

  body {
    background: transparent;
  }

  .navbar,
  .page-header {
    display: none;
  }

  .card {
    box-shadow: none;
  }
}
