@import url("https://fonts.googleapis.com/css?family=Inter:100,300,400,500,700,900&display=swap");

body {
    font-family: "Inter";
    font-size: 0.98em;
    font-weight: 300;
    overflow: hidden;
}
/* colours */

.bg-primary {

    background-color: #003D74 !important;
}

.bg-primary-subtle {

    background-color: #00BDFF !important;
}


.text-primary-icon {
    color: #174c8a !important;
}

.text-primary {

    color: #003676 !important;
}

.text-primary-subtle {

    color: #00BDFF !important;
}

.btn-primary
{
    background-color: #003D74;
}

.menu ul li a
{
    color: #eee !important;
}

.menu .title {

    background-color: #1a5190 !important;

    color: #ddd !important;
}

.menu ul li.active
{
    background-color: #023a6c;
}

.menu ul li:hover
{
    background-color: #ffffff28;
}

/* font-size */

.fs-banner {
    font-size: 2em;
}

.fs-largest {
    font-size: 2.5em;
}

.fs-larger {
    font-size: 1.7em;
}

.fs-large {
    font-size: 1.2em;
}

.fs-normal {
    font-size: 1em;
}

.fs-small {
    font-size: 0.9em;
}

.fs-smaller {
    font-size: 0.8em;
}

.fs-smallest {
    font-size: 0.7em;
}


/* custom */

.logo {
    width: 150px;
}

.logo-sm {
    width: 20px;
}

.sidebar {
    width: 240px !important;
}

.bg-logo {
    background-image: url('../img/icon.svg');
    background-repeat: no-repeat;
    background-position:center;
    background-size: cover;
}

.opacity-4 {
    opacity: 3%;
}

label, input, select, textarea
{
    font-size: 0.9em !important;
    font-weight: 300 !important;
    padding: 2px;
}

textarea
{
    min-height: 6rem !important;
}

div.filter button:hover
{
    background: inherit !important;
    color: #003676 !important;
}

div.input-group.filter
{
    min-width:180px;
    height:18px;
}

input[name=filter]
{
    width: 160px !important;
}

input[name=daterange]
{
    width: 220px !important;
    margin-left: 10px !important;
    background-image: url('/asset/img/datetime.png') !important;
    background-repeat: no-repeat !important;
    background-position: 96% 10px !important;
    font-size: 14px !important;
}

.daterangepicker th.month {
    width: auto;
    font-weight: 500;
}

/* Custom Table design (v2) */


table i.badge
{
    font-style: normal;
    font-weight: 400;
    padding: .5rem !important;
    min-width: 60px;
}

 .table-responsive {
    height: 500px;
    /* background-color: #fff; */
}

 .table-responsive a {
    color: #333;
}

 .table-responsive table {
    font-size: 0.85em;
    font-weight: 300;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-accent-bg: rgb(156 156 156 / 5%);
    color: var(--bs-table-striped-color);
}

 .table-responsive tr th {
    text-align: center;
    font-size: 0.9em;
    padding: 0.9rem;
}

 .table-responsive thead tr th {
    background-color: #e3f0ff;
    color: #444;
    font-weight: 500;
}

 .table-responsive tbody tr td {
    padding: 0.9rem;
    max-width: 400px;          /* Limit cell width */
    white-space: nowrap;       /* Prevent wrapping */
}

 .table-responsive tbody tr td.long-text {
    min-width: 300px;
    white-space: normal;     /* Prevent wrapping */
}

 .table-responsive tbody tr th
 {
   background-color: #f8f8f8;
   color: #333;
   font-weight: 300;
 }
 

.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-bg-type: #fafdff;
}

ul.pagination li
{
    padding: 0px 4px;
}

ul.pagination li.disabled a
{
    background-color: #f8f9fa !important;
}

ul.pagination .active >.page-link {
    background-color: #0056a3;
    border-color: transparent;
    color: white;
}
ul.pagination .page-link {
    color: #999;
    padding: 3px 12px;
    font-size: 0.8em;
}

ul.pagination .disabled > .page-link {
    background-color: #f0f0f1;
}

ul.pagination .total {
   font-size: 0.8em !important;
   font-weight: 300 !important;
}