:root{
    --qm:#4458dc;
  }
  html{
    height: 100%;
  }
  body {
    font-size : 0.95rem;
    display: flex;
    flex-direction: column;
    height:100%;
  }
  .btn-qm {
    background: white;
    color: var(--qm);
    border:1px solid;
    border-color: var(--qm);
    font-weight: 600;
  }
  .btn-qm:hover {
    background-color: var(--qm);
    color: white;
  }
  .btn-rqm {
    background-color: var(--qm);
    color: white;
    font-weight: 600;
    border:1px solid;
    border-color: var(--qm);
  }
  .btn-rqm:hover {
    background-color: white;
    color: var(--qm);
  }
  input:hover {
    outline: none;
    box-shadow: 0px 0px 5px var(--qm);
    border:1.5px solid var(--qm);
  }
  html::-webkit-scrollbar{
  width:10px !important;
  }
  html::-webkit-scrollbar-track{
  background: white !important;
  }
  html::-webkit-scrollbar-thumb{
  background: var(--qm) !important;
  }
  html::-webkit-scrollbar-thumb:hover{
  background:var(--qm) !important;
  }
  .select2 {
  width: 100% !important;
  }
  .spinner {
  position: fixed;
  z-index: 1031;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  }
  thead{
  background-color:var(--qm);
  color:white;
  }
  thead th{
  font-size : 0.96rem;
  }
  .navbar{
    transition: all 0.5s;
    margin-bottom: 0x;
    background-color: var(--qm);
  }
  .navbar .navbar-brand{
  position: relative;
  color: white;
  }
  .navbar .nav-link{
    position: relative;
    color: white;
  }
  .navbar .nav-link::after{
    content: '';
    opacity: 0;
    transition: all 0.3s;
    height: 2px;
    width: 100%;
    background-color: black;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .navbar .nav-link:hover::after{
    opacity: 1;
  }
  .mod-content {
    border-width: 1px;
    background-color: #ffffff; /* Clean, bright background */
  }
  .mod-header {
    background-color: var(--qm);
    color: white;
    padding: 20px 30px; /* Increased padding for a more spacious feel */
    border-bottom: 2px solid grey;
  }
  .mod-header .btn-close {
    filter: invert(1);
    transition: transform 0.2s; /* Animation for close button */
  }
  .mod-header .btn-close:hover {
    transform: scale(1.1); /* Scale effect on hover */
  }
  .mod-header p{
    font-size: larger;
    font-weight: bold;
    color: white;
  }
  .mod-body{
    font-family: 'Arial', sans-serif; /* Clean, modern font */
    padding: 20px; /* Ample padding for spaciousness */
  }
  .mod-footer {
    border-top: 1px solid grey /* Divider for clarity */
  }
  input[type="text"]:disabled {
    background-color: #ddd; /* or any other desired color */
  }
  .readonly {
    background-color: #f0f0f0;
    color: #777;
    border: 1px solid #ccc;
    pointer-events: none;
  }