/* css override */

/* hide alert, it will be displayed by jquery as toast */
.alert {
    display: none;
}

/* adminlte last p fix */
p:is(:last-child) {
    margin-bottom:0;
}

.table-striped-2 tbody:nth-child(even) {
    background: #ECECEC;
}


[v-cloak] {
    display: none !important;
}

.card-rounded {
    border-radius: 1.25rem;
}

.pre-json {
    max-height: 150px;
    overflow: auto;
    font-size: 0.75em;
    background: #f4f4f4;
    padding: 4px;
    border-radius: 4px;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Define the duration and easing */
/* .fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease;
  background-color: red;
} */

/* Define the start of entering and end of leaving */
/* .fade-enter-from,
.fade-leave-to {
  opacity: 0;
} */

/* keep row-action dropdowns above later siblings like card-footer pagination */
.dropdown-menu {
    z-index: 1051;
}

/* .card uses flexbox, so card-footer (pagination) paints over card-body by DOM order
   unless card-body gets an explicit z-index to force it above as a stacking context */
.card > .card-body {
    z-index: 1;
}

/* Target standard and webkit pseudo-classes specifically across AdminLTE form controls */
.form-control:autofill,
.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus,
.form-control:-webkit-autofill:active {
  /* 1. Force an inner box-shadow using your intended theme color (e.g., white #ffffff or dark dark-mode background) */
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  
  /* 2. Fix the text color so it remains visible against your new background */
  -webkit-text-fill-color: #495057 !important; 
}

/* Optional: If you are using AdminLTE Dark Mode, swap the colors above to match */
.dark-mode .form-control:autofill,
.dark-mode .form-control:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #343a40 inset !important;
  box-shadow: 0 0 0 1000px #343a40 inset !important;
  -webkit-text-fill-color: #fff !important;
}


/* Custom class for Bootstrap 4 full-screen modal */
.modal-fullscreen {
  padding: 0 !important;
}

.modal-fullscreen .modal-dialog {
  max-width: 100%;
  width: 100%;
  height: 100%;
  margin: 0;
}

.modal-fullscreen .modal-content {
  height: 100%;
  border: 0;
  border-radius: 0;
}

.modal-fullscreen .modal-body {
  overflow-y: auto; /* Ensures long content inside the body scrolls correctly */
}