// This file is used for writing your custom styles

:root {
  --bs-primary:#f1bf11;
  --mid-yellow:#cf8b02 ;
  --full-black:#000;
  --full-white:#fff;
  --theme-blue:#0056A3;
  --theme-red:#e55353;
}

.app-brand .app-brand-logo span img {
  height: 50px;
  width: auto;
}
.menu-vertical .menu-item.active > .menu-toggle
{
  background-color: transparent;
}
.menu-item.active > .menu-link:not(.menu-toggle) {
  background: var(--bs-primary);
  color: var(--full-black);
}
.text-primary {
    color: var(--mid-yellow)!important;
}
.btn-primary {
  color: var(--full-black);
}
.btn-primary:hover {
  color: var(--full-black);
}
.bg-primary {
    color: var(--full-black);
    background-color: var(--bs-primary)!important;
}
.tabler-check {
  color: var(--full-black);
}
.tabler-trash {
  color: var(--theme-red);
}
.pagination .active .page-link {
  color: var(--full-black) !important;
}
.menu .menu-sub > .menu-item > .menu-link::before  {
  background-color: var(--mid-yellow)!important;
}

.text-body[href]:hover, .text-heading[href]:hover {
  color: var(--mid-yellow) !important;
}


[data-bs-theme="light"] {
  --bs-heading-color : var(--full-black);  
  body {
    background: #F9E784;
    background: linear-gradient(135deg, rgba(249, 231, 132, 0.40) 0%, rgba(255, 255, 255, 1) 100%, rgba(237, 221, 83, 0.5) 100%);
  }
  aside {
    background-color: var(--theme-blue);
  }

  aside .layout-menu-toggle {
    color: var(--full-white);
  }
  .menu-item .menu-link{
    color: var(--full-white);
  }
  .menu-item:not(.open,.active) .menu-link:hover{
    color: var(--full-black);
  }
  .menu-toggle::after {
    background-color: var(--full-white);
  }
  .menu-item:not(.open,.active) .menu-toggle:hover::after {
      background-color: var(--full-black);
  }
  .menu-item:not(.active) > .menu-link:not(.menu-toggle):focus {
    color: var(--bs-primary) !important;
    font-weight: 600;
  }
  .bg-label-primary {
    color: var(--mid-yellow) !important;
  }
  .tabler-edit{
    color: var(--theme-blue);
  }
  .btn-label-primary {
    color: var(--theme-blue);
  }
  .footer-link{
    color : var( --bs-body-color) !important;
  }
  .select2-container--default .select2-results__option--highlighted {
    color: var(--theme-blue) !important;
  }
  .dropdown-item.active {
    color: var(--theme-blue);
  }
}