/*================================================================================
	Item Name: Frest HTML Admin Template
	Version: 1.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.error {
  color: #f44336;
}

.reset_button {
  background-color: #ffffff !important;
  border: 1px solid #395996 !important;
  color: #395996;
  padding: 10px 35px;
  font-family: Roboto;
  font-weight: 300;
  border-radius: 0px;
  margin-top: 12px;
  line-height: normal;
  width: auto;
}
.reset_button:hover {
  background-color: #395996 !important;
  border: 1px solid #395996 !important;
  color: #ffffff !important;
}
.save_button_custom {
  background-color: #395996 !important;
  border: 1px solid #395996 !important;
  color: white;
  padding: 10px 35px;
  font-family: Roboto;
  font-weight: 300;
  border-radius: 0px;
  margin-top: 12px;
  line-height: normal;
  width: auto;
}

.save_button_custom:hover {
  background-color: #ffffff !important;
  border: 1px solid #395996 !important;
  color: #395996 !important;
}

.main-menu.menu-light {
  background: #395996;
}

.main-menu.menu-light .navigation {
  background: #395996;
}

.main-menu.menu-light .navigation li a {
  color: white;
  font-size: 16px;
  font-weight: 500;
}

.main-menu .shadow-bottom {
  background: transparent;
}

.main-menu.menu-light .navigation .navigation-header {
  color: white;
  font-size: 16px;
  font-weight: 600;
  margin-block: 20px;
}

.main-menu.menu-light .navigation > li.nav-item.open .menu-content li a {
  color: #000;
}

.nav-item.has-sub.open .menu-title.text-truncate {
  color: #000;
}

.wizard .steps ul li.current a {
  color: #395996 !important;
  font-size: 18px;
  font-weight: 500;
  text-align: center;
}

.wizard .steps ul li.current::before {
  background-color: #395996 !important;
}

.wizard .steps ul li.disabled a .step {
  border: 3px solid #395996 !important;
}

.wizard .steps ul li.current ~ li a {
  font-size: 18px;
  font-weight: 500;
  text-align: center;
}

label {
  font-size: 14px;
  font-weight: 600;
  color: #000000;
}

.form-control {
  border: 1px solid #00000080 !important;
}

.pagination .page-item.active .page-link,
.pagination .page-item.active .page-link:hover {
  border-radius: 0.267rem;
  background-color: #395996 !important;
  color: #fff;
}

.scroll-top {
  background-color: #395996 !important;
  border: 1px solid #395996 !important;
  padding: 6px 10px 10px 10px !important;
}

.scroll-top:hover {
  background-color: #395996 !important;
  border: 1px solid #395996 !important;
}
.form-control {
  height: auto !important;
}
#chkins .form-control {
  width: auto;
}

.hotel_features_custom {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hotel_features_custom a {
  flex: 0 0 calc(20% - 10px);
  /* 3 columns with gap accounted */
  box-sizing: border-box;
  background: #f0f0f0;
  padding: 10px;
}

.hotel_features_custom .btn-success {
  border-color: #395996 !important;
  background-color: #395996 !important;
  color: #fff;
  border: 1px solid;
  font-size: 15px;
}

.hotel_features_custom .btn-success:hover {
  border-color: #395996 !important;
  background-color: #fff !important;
  color: #395996 !important;
}

.btn.btn-success {
  border-color: #395996 !important;
  background-color: #395996 !important;
  color: #fff;
  border: 1px solid;
  font-size: 15px;
  border-radius: 5px;
}

.btn.btn-success:hover {
  border-color: #395996 !important;
  background-color: #fff !important;
  color: #395996 !important;
}
.btn.btn-default {
  border-color: #395996 !important;
  background-color: #395996 !important;
  color: #fff;
  border: 1px solid;
  font-size: 15px;
  border-radius: 5px;
}
.btn.btn-default:hover {
  border-color: #395996 !important;
  background-color: #fff !important;
  color: #395996 !important;
}

.btn.btn-danger {
  color: #ffffff !important;
  border-color: #ff2829 !important;
  background-color: #ff2829 !important;
  border: 1px solid;
  border-radius: 5px;
}
.btn.btn-danger:hover {
  color: #ff2829 !important;
  border-color: #ff2829 !important;
  background-color: #ffffff !important;
}
.btn.btn-primary {
  border-color: #395996 !important;
  background-color: #fff !important;
  color: #395996 !important;
  border: 1px solid;
  font-size: 15px;
  border-radius: 5px;
}
.btn.btn-primary:hover {
  border-color: #395996 !important;
  background-color: #395996 !important;
  color: #fff !important;
}
.table td {
  padding: 10px 15px !important;
}
.table td i {
  color: #395996;
  font-size: 16px;
  padding: 6px;
  border: 1px solid #395996;
  border-radius: 3px;
  margin: 1px 4px;
}
.table td i:hover {
  color: #ffffff;
  background-color: #395996;
  border: 1px solid #395996;
}
.btn.btn-danger.btn-sm.btn-icon.icon-left {
  border-color: transparent !important;
  background-color: transparent !important;
  color: transparent;
  padding: 0;
}
.fa.fa-ban {
  color: #ff2829;
  font-size: 16px;
  padding: 6px;
  border: 1px solid #ff2829;
  border-radius: 3px;
  margin: 1px 4px;
}
.fa.fa-ban:hover {
  color: #ffffff;
  background-color: #ff2829;
  border: 1px solid #ffffff;
  border-radius: 5px;
}
.sticky_col_table {
  position: sticky !important;
  right: 0;
  background: white;
  z-index: 2;
}
.swal2-confirm {
  border: 1px solid red !important;
  padding: 10px;
  border-radius: 6px;
  margin: 10px;
  background: red;
  color: white;
}
.swal2-confirm:hover {
  border: 1px solid red;
  padding: 10px;
  border-radius: 6px;
  margin: 10px;
  background: rgb(255, 255, 255);
  color: red;
}
.swal2-cancel {
  border: 1px solid #395996;
  padding: 10px;
  border-radius: 6px;
  margin: 10px;
  background: #395996;
  color: white;
}
.swal2-cancel:hover {
  border: 1px solid #395996;
  padding: 10px;
  border-radius: 6px;
  margin: 10px;
  background: rgb(255, 255, 255);
  color: #395996;
}

@media (min-width: 576px) {
  .template_model_email .modal-dialog {
    max-width: fit-content;
  }
}