:root {
    --bs-font-sans-serif: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --revoil-blue: rgb(0,137,208);
    --searchButton: #000099;
}

body{
    margin: 0;
    padding: 0;
    /* background-color: rgb(225, 248, 225); */
    background-color: rgb(255, 255, 255);
    height: 100vh;
}
.container{
    padding-bottom: 100px;
}

.body-logout{
    margin: 0;
    padding: 0;
    background-color: rgb(222, 222, 222);
    height: 100vh;
}

.login-info1{
    color:rgb(255, 255, 255);
    font-weight: bold;
    font-size: large;
}

.btn-login-info1{
    background-color: rgb(255, 255, 255);
    color: rgba(25,137,202,255);
    font-weight: bold;
    border: 2px solid rgb(9, 9, 65);
}



#submit{
    text-align: center;
}

#login {
    padding: 10px 30px;
    margin: 10px 20px;
}

#login-box{
    margin: 5px;
    padding: 20px;
}

#login .container #login-row #login-column #login-box {
    margin-top: 30px;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
    /* width: 100%; */
    border: 5px solid rgba(25,137,202,255);
    background-color: rgba(25,137,202,255);
}
#login .container #login-row #login-column #login-box #login-form {
    padding: 20px;
}
#login .container #login-row #login-column #login-box #login-form #register-link {
    margin-top: -85px;
}
.modal-title, h1, h2, h3, h4{
    color: rgb(0,137,208);
    font-weight: bold;
}
.modal-content {
    background-color: rgb(225, 248, 225);
}
.text-info1{
    color: rgb(0,137,208);
    font-weight: bold;
    font-size: large;
}
.btn-info1{
    color: white;
    background-color : rgb(0,137,208);
    font-weight: bold;
    border: 2px solid rgb(9, 9, 65);
}
.buttons{
    text-align: center;
}

#navtable{
    margin-top: 15px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 120%;
    font-weight: bold;
}
img{
    width: 100%;
    max-width: 220px;
    height: auto;
}
.mybrand{
    margin-top: 15px;
}
a, a:visited {
    color: blue;
}
a:hover {
    color: rgb(9, 9, 65);
}
#menutable{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
th {
    text-align: center;
    font-weight:bold;
    /* width: 50%; */
}
#title{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}
button{
    border: none;
    padding: 15px;
    width: 80%;
    text-align: center;
    font-size: 120%;
    font-family: Arial, Helvetica, sans-serif;
    /* font-size:2vw; */
    margin: 5px;
    /* cursor: pointer; */
    background-color: white; 
    color: black; 
    border: 3px solid rgb(0,137,208);
}

.valid{
    color: green;
}

.invalid{
    color: red;
}

.confirmButton, .swal2-confirm {
    /* width: fit-content; */
    background-color: rgb(0,137,208);
}

#transactionTable tr {
    background: rgb(0,137,208);
    color: #ffffff;
    text-align: center;
}

#transactionDetales {
    min-height: 50px;
    width: 80%;
    margin: auto;
    margin-top: 20px;
    border: var(--revoil-blue) solid 1px;
}
#cascelTransIdsection{
  min-height: 50px;
  width: 80%;
  margin: auto;
  margin-top: 20px;
  border: var(--revoil-blue) solid 1px;
}

#sectionCancelTransId{
  width: 80%;
  margin: auto;
  margin-top: 20px;
  border: var(--revoil-blue) solid 1px;
}

.btn-datatable {
    width: 100%;
    padding: auto;
    margin: auto auto;
    text-align: center;
    margin: auto;
    border: var(--revoil-blue) solid 1px;
    height: 40px;
}

.edButtonW {
    background-color: white;
    /* var(--revoil_nav_blue); */
    color: rgb(0,137,208);
    /* white;*/
    font-size: small;
    font-weight: bold;
    width: 110px;
  }


  .btn-small {
    background-color: white;
    /* var(--revoil_nav_blue); */
    color: rgb(0,137,208);
    /* white;*/
    font-size: small;
    font-weight: bold;
      width: 40px;
  }

  #save-pdf{
      /* width: fit-content;
      margin-right: 0%;
      float: right; */
      width: fit-content;
      display:inline-block;
      overflow: auto;
      /* white-space: nowrap; */
      margin:0px auto;
  }

  table thead th {
    background-color: #99CA3C;
    position: sticky;
    top: 0;
}

#AlltransContainer_1 {
    padding-top: 40px;
    padding-bottom: 10px;
}

#AlltransContainer_2 {
    padding-top: 10px;
    padding-bottom: 10px;
    visibility: hidden;
}

#AllCustomers {
    padding-top: 10px;
    padding-bottom: 10px;
}

.searchButton {
border-radius: 20px 20px 20px 20px;
padding: 8px;
font-size: 20px;
text-align: center;
font-weight: bold;
color: #fff;
background-color: var(--revoil-blue);
/* box-shadow: 0 6px rgb(186, 186, 186); */
width: 100%;
}

.force-white {
    background-color: white !important; 
}

.swal-wide{

    width:40% !important;
}

/* .excelTransButton{
    background-color: var(--revoil_nav_blue) !important;
    color: white !important;
    font-weight: bold !important;
    font-size: large !important;
    width: 150px !important;
} */

.list-element::before {
    content: "●";
    margin-right: 0.75rem;
  }

#button-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

.d-none {
    display: none !important;
}