html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

#loadingScreen {
    background-color: rgba(20, 20, 20,.8);
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
    background: url("../images/bg-img.png") no-repeat center center fixed;
    background-size: cover;
    height: 100%;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}

.card-header {
    background-color: #233264 !important;
    color: white !important;
}

.table-primary {
    --bs-table-bg: #233264 !important;
    --bs-table-striped-bg: #233264 !important;
    --bs-table-striped-color: white !important;
    --bs-table-active-bg: #233264 !important;
    --bs-table-active-color: white !important;
    --bs-table-hover-bg: #233264 !important;
    --bs-table-hover-color: white !important;
    color: white !important;
    border-color: #bacbe6;
}


.table-primary th {
    color: white !important;
}

.table-primary a {
    color: white !important;
}

/* navbar styles
-------------------------------------------------- */

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}


/* model dialog styles
-------------------------------------------------- */
.custom-modal {
    max-width: 80%; /* or any specific pixel value */
    margin: 50px auto;
}

.custom-modal .modal-content {
    height: auto; /* Adjust based on content or set a specific height */
    overflow-y: auto; /* Allows scrolling within the modal */
}

/* Header background color */
.modal-header {
    background-color: #233264 !important; /* Bootstrap primary color */
    color: white;
}

.modal-header .btn-close img {
    filter: brightness(0) invert(1); /* Inverts colors, making black white */
}

.modal-header .btn-close img {
    filter: brightness(0) invert(1); /* Inverts colors, making black white */
}

/* Body background color */
.modal-body {
    background-color: #f8f9fa; /* Light grey */
}

/* Footer background color */
.modal-footer {
    background-color: #e9ecef; /* Darker grey */
}

.modal-table {
    width: 100%;
    border-collapse: collapse;
}

.modal-table th, .modal-table td {
    border: 1px solid #dee2e6; /* Bootstrap-like light gray border */
    padding: 8px; /* Adequate padding for content */
    text-align: left; /* Align text to the left; adjust as needed */
}

.modal-table th {
    background-color: #007bff; /* Bootstrap primary blue */
    color: white; /* White text for contrast */
}

.modal-table tr:nth-child(even) {
    background-color: #f2f2f2; /* Zebra striping for rows */
}

.modal-table tr:hover {
    background-color: #cce5ff; /* Light blue background on hover */
    cursor: pointer; /* Change cursor to indicate row is clickable */
}

@media (max-width: 768px) {
    .custom-modal {
        width: 100%;
        margin: 10px;
    }

    .modal-content {
        overflow-y: auto;
    }
}

.validation-summary-valid {
    display: none;
}

.validation-summary-valid span {
    display: none;
}