/*-----------------
    13. Common
-----------------------*/
@media (max-width: 1199.98px) {

  .container,
  .container-sm {
    max-width: 100%;
  }
}

.page-wrapper {
  margin-left: 248px;
  padding-top: 76px;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

@media (max-width: 1199.98px) {
  .page-wrapper {
    margin-left: 200px;
  }
}

.page-wrapper .content {
  padding: 24px;
}

@media (max-width: 1199.98px) {
  .page-wrapper .content {
    padding: 20px;
  }
}

@media (max-width: 991.98px) {
  .page-wrapper .content {
    padding: 16px;
  }
}

@media (max-width: 991.98px) {
  .page-wrapper {
    margin: 0;
    padding-top: 60px;
  }
}

.content-page-header {
  align-items: center;
  -webkit-align-items: center;
  margin: 0 0 30px 0;
}

@media (max-width: 575.98px) {
  .content-page-header {
    display: block;
  }
}

@media (max-width: 768px) {
  .content-page-header {
    margin: 0 0 30px 0;
  }
}

.content-page-header h5 {
  font-size: 24px;
  color: #2f2f2f;
  font-weight: 600;
  margin: 0;
}

@media (max-width: 768px) {
  .content-page-header h5 {
    font-size: 18px;
  }
}

.content-page-header h6 {
  font-size: 20px;
  color: #2f2f2f;
  font-weight: 600;
  margin: 0;
}


.card .card-header {
  border-color: #f0f1f5;
  background-color: #ffffff;
  padding: 1.5rem;
}

.card .card-header:first-child {
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

@media (max-width: 1199.98px) {
  .card .card-header {
    padding: 16px;
  }
}

.card .card-body {
  position: relative;
  padding: 1.5rem;
}

@media (max-width: 1199.98px) {
  .card .card-body {
    padding: 16px;
  }
}

.card .card {
  position: relative;
  padding: 1.5rem;
}

@media (max-width: 1199.98px) {
  .card .card {
    padding: 16px;
  }
}

.text-success-light {
  color: #2f2f2f !important;
}

.text-warning-light {
  color: #ffcd01;
}

.warning-border {
  border: 1px solid #ffcd01;
  padding: 0 4px;
  border-radius: 50px;
}

.danger-border {
  border: 1px solid #FF0000;
  padding: 0 4px;
  border-radius: 50px;
}

.info-border {
  border: 1px solid #377dff;
  padding: 0 4px;
  border-radius: 50px;
}

.text-primary {
  color: #ffcd01 !important;
}

.text-danger {
  color: #FF0000 !important;
}

.text-gray-light {
  color: #2f2f2f;
}

.text-gray-dark {
  color: #3F4254;
}

.text-muted {
  color: #ededed !important;
}

.bg-light-gray {
  background: #F3F3F3;
}

.bg-primary-light {
  background: #EADDFF;
}

.bg-green-light {
  background: #E1FFED;
}

.bg-danger-light {
  background: #FFECEC;
}

.bg-white-smoke {
  background: #EFEFEF;
}

.bg-light-primary {
  background: #ededed !important;
}

.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}

.dropdown-item {
  font-size: 12px;
  padding: 8px 10px;
}

.add-cate-status {
  margin: 50px 0 0 0 !important;
}

@media (max-width: 575.98px) {
  .add-cate-status {
    margin: 0 !important;
  }
}

.why-us {
  background: #F1F0ED;
}

@media (max-width: 992px) {
  .why-us {
    border-radius: 24px;
  }
}

.why-us .card {
  background: #fff;
  border-radius: 12px;
  border: 0px;
}

.why-us h4 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 4px;
}

.why-us .jeep {
  border-radius: 24px;
  background: #E3D9D2;
}

.why-us .card-body {
  display: flex;
  align-items: center;
  padding: 32px;
}

@media (max-width: 680px) {
  .why-us .card-body {
    padding: 10px;
  }

  .why-us h4 {
    font-size: 20px;
  }
}

@media (max-width: 480px) {
  .why-us h4 {
    font-size: 18px;
  }
}

@media (max-width: 992px) {
  .why-us .card-body {
    justify-content: start;
  }
}

.why-us .card-body img {
  height: 24px;
  width: auto;
}

.why-us .card-body .img-container {
  background: #f5f5f5;
  height: 100%;
  min-width: 54px;
  display: flex;
  align-items: center;
  padding: 40px 16px;
  margin-right: 10px;
  border-radius: 12px;
}

@media (max-width: 480px) {
  .why-us .card-body .img-container {
    padding: 40px 16px;
    flex-shrink: 0;
  }

  .why-us .card-body img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }
}

.login-wrapper .login-auth .form-group .forgot-link {
  padding-left: 30px;
}

.form-group .forgot-link {
  color: #FF0000;
  font-size: 16px;
  font-weight: 500;
}

.form-group label {
  margin: 0 0 10px 0;
  font-size: 16px;
  font-weight: 700;
  color: #2F2F2F;
}

@media (max-width: 1199.98px) {
  .form-group label {
    font-size: 16px;
  }
}

.form-group .optional {
  font-weight: 400;
  font-size: 12px;
  color: #2f2f2f;
}

.form-group .form-control {
  background: transparent;
  border: 1px transparent;
  box-shadow: none;
  border-radius: 8px 0 0 8px;
  margin: 0;
  padding: 12px;
  font-size: 14px;
  font-weight: 400;
  color: #2e2e2e;
}

.form-group .form-control.input-control {
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.13);
  background-color: #f4f4f5;
  font-size: 16px;
  padding: 16px;
}

@media (max-width: 767.98px) {
  .form-group .form-control {
    margin: 0 0 16px;
    padding: 10px;
  }

  .book-car .form-group .form-control,
  .search-box-banner .form-group .form-control {
    margin: 0;
  }
}

.form-group .form-control ::placeholder,
.form-group .form-control ::-webkit-input-placeholder,
.form-group .form-control :-ms-input-placeholder {
  color: #2f2f2f;
  font-size: 14px;
  font-weight: 600;
}

.form-group .form-control .form-title {
  font-weight: 600;
  font-size: 16px;
  color: #2f2f2f;
  margin: 0 0 24px 0;
}

.form-group .search-btn .check-available {
  padding: 12px 20px;
}

.form-group textarea.form-control {
  height: auto;
}

.form-group .intl-tel-input,
.form-group .iti {
  width: 100%;
}

.form-group .note-toolbar {
  background: #ffffff;
}

.form-group .note-editable {
  background: #ffffff;
}

.form-group .note-resizebar {
  height: 0 !important;
}

.form-group .toggle-password {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 0;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, 50%);
}

.form-group .feather-eye-off {
  color: #2f2f2f;
}

.form-group .feather-eye {
  margin-right: 1px;
  color: #2f2f2f;
}

.custom_check {
  position: relative;
  padding-left: 30px;
}

.custom_check .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 16px;
  width: 16px;
  border: 1px solid #828282;
  background-color: #ffffff;
  border-radius: 10px;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.login-form-checkbox-label span.checkmark {
  top: 50%;
  transform: translateY(-50%);
}

.custom_check .checkmark::after {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  position: absolute;
  display: none;
  color: #828282;
  font-size: 12px;
}

.custom_check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.custom_check input:checked~.checkmark {
  background-color: #ffffff;
}

.custom_check input:checked~.checkmark:after {
  display: block;
}

.custom_check span {
  color: #828282;
  font-weight: 400;
}

.pass-group {
  position: relative;
}

.close {
  background: transparent;
  border: 0;
  color: #28283C;
  font-size: 28px;
  line-height: normal;
  top: 20px;
  width: auto;
  height: auto;
  right: 20px;
}

.close span {
  background: #888888;
  border-radius: 50px;
  font-size: 20px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
}

.close span:hover {
  background: #ffcd01;
  color: #ffffff;
  transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
}

.card-title {
  margin-bottom: 0;
  border-radius: 10px;
}

.cal-icon {
  position: relative;
  width: 100%;
}

.cal-icon:after {
  color: #979797;
  content: "\f073";
  display: block;
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  font-size: 16px;
  margin: auto;
  position: absolute;
  right: 16px;
  top: 10px;
}

.cal-icon-info:after {
  font-family: "Feather";
  content: "\e926";
  color: #2f2f2f;
  font-weight: 400;
  font-size: 18px;
  top: 8px;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.progress-wrap {
  position: fixed;
  right: 12px;
  bottom: 24px;
  height: 36px;
  width: 36px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  box-shadow: inset 0 0 0 2px rgba(75, 64, 237, 0.2);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
  transform: translateY(16px);
  -webkit-transform: translateY(16px);
  -moz-transform: translateY(16px);
  -ms-transform: translateY(16px);
  -o-transform: translateY(16px);
}

.progress-wrap::after {
  position: absolute;
  content: "\f062";
  font-family: "FontAwesome";
  text-align: center;
  line-height: 36px;
  font-size: 16px;
  color: #ffffff;
  left: 0;
  top: 0;
  height: 36px;
  width: 36px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

.pagination .pagination {
  flex-wrap: wrap;
}

@media (max-width: 479px) {

  .pagination .pagination .previtem,
  .pagination .pagination .nextlink {
    margin-bottom: 10px;
  }
}

.pagination .pagination .previtem a,
.pagination .pagination .nextlink a {
  height: 38px;
  border-radius: 10px;
  padding: 0 20px;
  color: #2F2F2F;
}

@media (max-width: 479px) {
  .pagination .pagination li .page-group ul {
    flex-wrap: wrap;
  }
}

@media (max-width: 479px) {
  .pagination .pagination li .page-group ul li {
    margin-bottom: 10px;
  }
}

.pagination .pagination-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagination .pagination-center .page-group .page-item a {
  border: 1px solid #DEE2E7;
  background: #ffffff;
  border-radius: 10px;
  padding: 10px 20px;
  margin: 0 12px 0 0;
  color: #2F2F2F;
  width: 48px;
  height: 38px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagination .pagination-center .page-group .page-item a:focus {
  outline: 0;
}

.pagination .pagination-center .page-group .page-item .active {
  background-color: #ffcd01;
  color: #ffffff;
  border: 1px solid #ffcd01;
}

.pagination .pagination-center .page-group ul {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 0 10px;
}

.privacy-section {
  position: relative;
  padding: 0 0 80px;
  background: #ffffff;
}

.privacy-section h2 {
  text-transform: lowercase;
  text-transform: capitalize;
}

.privacy-section h2,
.privacy-section h3 {
  font-family: 'Montserrat', sans-serif;
}

.privacy-section h3 {
  font-weight: 600;
  margin-bottom: 16px;
}

@media (max-width: 991.98px) {
  .privacy-section {
    padding: 0 0 40px;
  }
}

.privacy-section .terms-policy p+h3 {
  margin-top: 30px;
}

.privacy-section .terms-policy p {
  margin: 0 0 10px;
}

@media (max-width: 991.98px) {
  .privacy-section .terms-policy p {
    margin: 0 0 10px;
  }
}

.privacy-section .terms-policy ul {
  margin: 0 0 38px;
}

.privacy-section .terms-policy ul li {
  margin: 0 0 12px;
}

.privacy-section .terms-policy ul li span {
  margin-right: 10px;
  color: #ffcd01;
}

.error-page {
  padding: 50px;
  align-items: center;
  color: #28283C;
  font-weight: 700;
}

@media (max-width: 575.98px) {
  .error-page {
    padding: 50px;
  }
}

.error-box {
  margin: 40px auto;
  max-width: 600px;
  text-align: center;
  width: 100%;
}

.error-box img {
  margin: 0 0 50px;
}

.error-box h3 {
  font-size: 28px;
  margin-bottom: 10px;
}

.error-box p {
  margin: auto auto 30px;
  color: #787878;
  font-weight: 600;
  max-width: 560px;
}

.error-box .btn-maintance {
  border-radius: 4px;
  font-weight: 600;
  font-size: 16px;
  padding: 12px 20px;
}

@media (max-width: 768px) {
  .error-box .btn-maintance {
    padding: 8px 12px;
    font-size: 14px;
  }
}

.error-box .error-500 {
  margin: 0 0 60px;
}

.error-box .coming-soon {
  padding: 50px 0 8px;
  color: #28283C;
}

@media (max-width: 767.98px) {
  .error-box .coming-soon {
    font-size: 20px;
  }
}

.error-box .back-button .btn {
  padding: 16px 20px;
  font-size: 16px;
}

@media (max-width: 575.98px) {
  .error-box .back-button .btn {
    padding: 10px;
    font-size: 14px;
  }
}

.serve-form {
  margin: 0 0 40px;
}

@media (max-width: 767.98px) {
  .serve-form {
    padding-bottom: 30px;
  }
}

.serve-form .form-group {
  margin-bottom: 0;
}

.serve-form .form-group .form-control {
  margin-right: 10px;
  font-size: 14px;
  background: #ffffff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.serve-form .form-group .form-control::placeholder {
  color: #2F2F2F;
  font-weight: 600;
}

@media (max-width: 767.98px) {
  .serve-form .form-group .form-control {
    min-height: 46px;
    font-size: 14px;
  }
}

.serve-form .form-group .button-notific {
  min-width: 116px;
  height: 48px;
  color: #ffffff;
  border-radius: 4px;
  background: #2f2f2f;
  font-weight: 600;
  font-size: 16px;
}

@media (max-width: 767.98px) {
  .serve-form .form-group .button-notific {
    min-width: 100px;
    font-size: 14px;
  }
}

.serve-form .form-group .button-notific:hover {
  color: #ffffff;
  background: #3F4254;
  border: 1px solid #3F4254;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.progress-wrap {
  position: fixed;
  right: 12px;
  bottom: 24px;
  height: 36px;
  width: 36px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  box-shadow: inset 0 0 0 2px rgba(75, 64, 237, 0.2);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
  transform: translateY(16px);
  -webkit-transform: translateY(16px);
  -moz-transform: translateY(16px);
  -ms-transform: translateY(16px);
  -o-transform: translateY(16px);
}

.progress-wrap svg.progress-circle path {
  stroke: #ffcd01;
  stroke-width: 4;
  box-sizing: border-box;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

.progress-wrap svg path {
  fill: none;
}

.progress-wrap::after {
  position: absolute;
  content: "\f062";
  font-family: "FontAwesome";
  text-align: center;
  line-height: 36px;
  font-size: 16px;
  color: #ffcd01;
  left: 0;
  top: 0;
  height: 36px;
  width: 36px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
}

iframe {
  width: 100%;
}


/* 
.bootstrap-datetimepicker-widget.dropdown-menu.usetwentyfour.bottom {
  width: 100%;
  z-index: 9999 !important;
} */

.bootstrap-datetimepicker-widget table td span {
  display: inline-block;
  width: 54px;
  height: 54px;
  line-height: 54px;
  margin: 2px 1.5px;
  cursor: pointer;
  border-radius: 4px;
}

.bootstrap-datetimepicker-widget .datepicker .prev,
.bootstrap-datetimepicker-widget .datepicker .next {
  width: 30px;
  text-align: center;
  font-size: 16px;
}

.bootstrap-datetimepicker-widget .datepicker .prev i,
.bootstrap-datetimepicker-widget .datepicker .next i {
  display: block;
}

.bootstrap-datetimepicker-widget .datepicker .datepicker-switch {
  padding: 0 10px;
  font-weight: bold;
  font-size: 14px;
}

.bootstrap-datetimepicker-widget .datepicker .prev {
  position: relative;
}

.bootstrap-datetimepicker-widget .datepicker .next {
  position: relative;
}

.bootstrap-datetimepicker-widget .datepicker .prev span,
.bootstrap-datetimepicker-widget .datepicker .next span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-40%, -40%);
}

.bootstrap-datetimepicker-widget .datepicker .prev span {
  transform: translate(-50%, -40%);
}

.content-wrapper {
  padding: 0 16px;
}

a.disabled-step {
  pointer-events: none;
  opacity: 0.5;
  cursor: not-allowed;
}

.btn-order.button-right.go-to-price-form {
  background-color: #3f75c9;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  margin-left: auto;
  width: 100%;
  margin-bottom: 0;
  height: 50px;
}

@media (max-width: 767.98px) {

  .go-to-price-form,
  .go-to-final-form,
  .complete-order-btn {
    /* margin-bottom: 0; */
  }

  #book-car .review-sec {
    padding-bottom: 0;
  }

  #book-car .review-sec .review-header .review-header-name {
    padding-bottom: 14px;
  }
}

@media (max-width: 992px) {
  #categoryForm .search-box-banner-list li:last-child button {
    margin-top: 0;
  }
}

.custom-toggle {
  width: 56px;
  height: 30px;
  border-radius: 100px;
  margin-left: 16px;
  position: relative;
  background-color: #C3C3C9;
  cursor: pointer;
  transition: background-color 0.5s ease;
}

.custom-toggle:after {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: white;
  top: 6px;
  left: 6px;
  transition: all 0.3s;
}

.toggle-on {
  background-color: #F3C644;
}

.toggle-on:after {
  left: calc(100% - 24px);
}

.book-car__tabs {
  display: flex;
  overflow-x: auto;

  position: relative;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;

  border-radius: 12px 12px 0 0;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-bottom: none;
  width: max-content;
}

.book-car__tab {
  flex: none;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
  font-family: 'Montserrat', sans-serif;
  overflow: hidden;
}

.book-car__tab:not(:first-child) {
  border-left: 1px solid rgba(0, 0, 0, 0.14);
}

@media (max-width: 768px) {
  .book-car__tab {
    min-width: 230px;
    text-align: center;
  }

  .book-car__tab a {
    padding: 18px 16px;
  }
}

.book-car__tab a {
  transition: background-color 0.5s ease, color 0.5s ease;
}

.book-car__tab.tab--active a {
  background-color: #424242;
  color: #fff;
}

.book-car__tab a {
  padding: 18px 24px;
  display: block;
}

.book-car__tab:first-child {
  border-top-left-radius: 12px;
}

.book-car__tab:last-child {
  border-top-right-radius: 12px;
}

.book-car__tab.book-car__tab--active {
  color: #479c16;
}

.book-car__tab.book-car__tab--active .book-car__tab-decor {
  background-color: #479c16;
}

.book-car__tab-decor {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #4e4e4e;
  display: flex;
  align-items: center;
  justify-content: center;
}

#book-car .review-sec {
  background-color: #f4f4f5;
}

#book-car .review-sec {
  padding: 0;
}

#book-car .review-sec .book-car-inner {
  padding: 24px;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 0 0 20px 20px;
}

#book-car .review-sec {
  margin: 0;
  background: transparent;
}

.tabs-content {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: opacity .3s ease;
  visibility: hidden;
}

.tabs-content.tabs-content--active {
  opacity: 1;
  visibility: visible;
  grid-template-rows: 1fr;
  box-shadow: 0px 4px 4px rgba(195, 195, 195, 0.25);
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.profile {
  padding: 20px 0 80px;
}

.profile__inner {
  display: flex;
  gap: 30px;
  align-items: start;
}

.profile .section-heading {
  margin-bottom: 30px;
}

.profile h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: 48px;
  text-align: left;
}

.nav-profile,
.profile__content {
  padding: 24px;
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.14);
  width: 100%;
  box-shadow: 0px 4px 4px rgba(195, 195, 195, 0.25);
}

.nav-profile {
  max-width: 330px;
  width: 100%;
}

.nav-profile__user {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 30px;
}

.nav-profile__user-img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
}

.nav-profile__user-name {
  font-size: 18px;
  font-weight: 600;
}

.nav-profile__item:not(:last-child) {
  margin-bottom: 10px;
}

.nav-profile__item.active .nav-profile__link {
  background-color: #696969;
  color: #fff;
}

.nav-profile__item:last-child.active .nav-profile__link path,
.nav-profile__item:nth-child(2).active .nav-profile__link path {
  stroke: #fff;
}

.nav-profile__item:first-child.active .nav-profile__link path,
.nav-profile__item:nth-child(3).active .nav-profile__link path {
  fill: #fff;
}

.nav-profile__link {
  padding: 14px 14px 14px 14px;
  border-radius: 8px;
  font-size: 18px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  font-weight: 500;
  transition: background-color 0.5s ease, color 0.5s ease;
}

.nav-profile__link path {
  transition: fill 0.5s ease, stroke 0.5s ease;
}

@media (hover:hover) {
  .nav-profile__link:hover {
    background-color: #696969;
    color: #fff;
  }

  .nav-profile__item:nth-child(2) .nav-profile__link:hover path,
  .nav-profile__item:last-child .nav-profile__link:hover path {
    stroke: #fff;
  }

  .nav-profile__item:nth-child(3) .nav-profile__link:hover path,
  .nav-profile__item:first-child .nav-profile__link:hover path {
    fill: #fff;
  }
}

.profile__title {
  font-size: 22px;
  font-weight: 700;
  display: block;
  width: 100%;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.14);
}

.profile__form {
  padding-top: 24px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  font-family: 'Montserrat', sans-serif;
}

.profile .profile__form .form-group {
  margin-bottom: 0;
}

.profile .profile__form .form-control.login-form-input {
  height: 50px;
  font-size: 14px;
}

.profile .profile__form .profile__form-password {
  grid-column: 1 / -1;
}

.profile__form-button {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-blue);
  font-family: var(--font-secondary);
  color: #ffffff;
  grid-column: 1 / -1;
  font-size: 16px;
  max-width: 250px;
  margin: 0 auto;
  padding: 0 40px;
}

/* @media (hover:hover) {
  .profile__form-button:hover {
    background-color: #FFCC00;
    color: #212529;
  } 
} */

@media (max-width: 992px) {
  .profile__inner {
    flex-wrap: wrap;
  }

  .nav-profile {
    max-width: 100%;
  }

  .profile h1 {
    font-size: 36px;
  }

  .nav-profile__link {
    font-size: 16px;
  }

  .profile__title {
    font-size: 20px;
  }
}


@media (max-width: 768px) {
  .profile__form {
    grid-template-columns: repeat(1, 1fr);
  }

  .profile .profile__form .form-control.login-form-input {
    margin: 0;
  }

  .profile h1 {
    font-size: 28px;
  }
}

.car-list {
  margin-bottom: 16px;
}

.car-list li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}

.car-list li span {
  font-size: 18px;
  font-family: 'Montserrat', sans-serif;
}

.car-list li h6 {
  font-size: 22px;
  font-weight: 700;
}

.car-btn {
  display: flex;
  justify-content: center;
  gap: 6px;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
  width: 100%;
  background-color: #FFCC00;
  color: #2a292b;
  border: none;
}

.btn.btn-order.search-button.car-btn:active {
  background-color: #FFCC00;
}

.car-btn i,
.product-details__banner-btn i {
  display: flex;
  align-items: center;
  transition: transform 0.5s ease;
  animation: car-btn 3s linear infinite;
}

.product-details__banner-btn:hover {
  color: #fff;
}

@keyframes car-btn {
  0% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(4px);
  }

  100% {
    transform: translateX(0);
  }
}

@media (hover:hover) {
  .car-btn:hover {
    background-color: #FFCC00;
    color: #2a292b;
  }

  /* .car-btn:hover i {
    transform: translateX(4px);
  } */
}

.booking-list li.car-option {
  background-color: #f7f7f7;
  padding: 20px;
  margin-bottom: 10px;
  border: 2px solid rgba(0, 0, 0, 0.14);
  display: flex;
  justify-content: space-between;
  border-radius: 12px;
  transition: border-color 0.5s ease;
}

.booking-list li.car-option.active {
  border-color: #F3C644;
}

.booking-list li.car-option .car-option-title-box strong {
  font-size: 18px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  color: #2a292b;
}

.booking-list .booking-list-box select {
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.14);
}

.car-option .service-price {
  display: block;
  font-family: 'Montserrat';
  font-size: 16px;
  font-weight: 500;
  color: #464547;
}

li.final_price.car-price-total,
div.final_price.car-price-total {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 700;
  margin: 16px 0;
}

div.final_price.car-price-total {
  display: flex;
  justify-content: space-between;
}

li.final_price.car-price-total h6,
div.final_price.car-price-total h6 {
  font-family: 'Montserrat', sans-serif;
  font-size: 22px;
  font-weight: 700;
}

.book-car {
  margin-bottom: 50px;
}

.book-car-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 24px;
}

@media (max-width: 680px) {
  .book-car-list {
    grid-template-columns: repeat(1, 1fr);
  }

  .car-payment-list {
    flex-wrap: wrap;
  }
}

.book-car-item:nth-child(3),
.book-car-item:nth-child(4),
.book-car-item:last-child {
  grid-column: 1 / -1;
}

.book-car-item {
  font-family: 'Montserrat', sans-serif;
}

.book-car-item label {
  font-weight: 600;
}

.book-car-item .form-group input,
.book-car-item .form-group select {
  height: 56px !important;
}

.book-car-item .form-group select.input-control {
  font-size: 14px;
}

.book-car-item .form-group input,
.book-car-item .form-group input::placeholder {
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.book-car-item .form-group {
  margin-bottom: 0;
}

.car-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  font-weight: 700;
  padding-bottom: 10px;
  display: block;
  margin-bottom: 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.14);
}

.car-payment-list {
  display: flex;
  gap: 10px 24px;
}

.car-payment-label {
  padding: 16px;
  width: 50%;
  display: flex;
  align-items: center;
  gap: 14px;
  background-color: transparent;
  border-radius: 12px;
  font-family: 'Montserrat', sans-serif;
  border: 1px solid rgba(0, 0, 0, 0.14);
  cursor: pointer;
  transition: background-color 0.5s ease, border-color 0.5s ease;
}

@media (max-width: 680px) {
  .car-payment-label {
    width: 100%;
  }
}

.car-payment-input {
  display: none;
}

.car-payment-radio-btn {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #111;
  flex-shrink: 0;
  transition: border-color 0.3s ease;
  position: relative;
}

.car-payment-radio-btn::after {
  content: '';
  position: absolute;
  display: block;
  width: 10px;
  height: 10px;
  background-color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  border-radius: 50%;
  transition: opacity 0.3s ease;
}

.car-payment-price {
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.car-payment-descr {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.1;
}

.car-payment-label:has(input[type="radio"]:checked) {
  background-color: #FDD431;
  border-color: #FFB700;
}

.car-payment-label input[type="radio"]:checked+.car-payment-radio-btn {
  border-color: #fff;
}

.car-payment-label input[type="radio"]:checked+.car-payment-radio-btn::after {
  opacity: 1;
}

.complete-order-btn {
  display: flex;
  justify-content: center;
  gap: 6px;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
  width: 100%;
  background-color: #FFCC00;
  color: #2a292b;
  border: none;
  height: 54px;
}

.alert-success,
.alert-danger {
  position: fixed;
  bottom: 0;
  z-index: 555;
  right: 16px;
  font-size: 16px;
  font-weight: 500;
  padding: 16px 50px 16px 16px;
}

.alert-success button,
.alert-danger button {
  position: absolute;
  top: 50%;
  height: auto;
  right: 20px;
  transform: translateY(-50%);
}

.profile__favorites-item {
  padding: 24px 0 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
}

.profile__favorites-item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.profile__favorites-delete {
  border: none;
  background-color: transparent;
  padding: 0;
  margin-right: 30px;
}

.profile__favorites-img {
  border-radius: 4px;
  object-fit: cover;
  object-position: center;
  margin-right: 16px;
}

.profile__favorites-box {
  margin-right: 16px;
}

.profile__favorites-link {
  margin-left: auto;

}

.profile__favorites-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 4px;
}

.profile__favorite-price h4.limited,
.profile__favorite-price small {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 16px;
}

.profile__favorite-price .item-prices {
  justify-content: start;
}

.profile__favorites-link {
  padding: 16px;
  max-width: 180px;
  width: 100%;
  background-color: #479c16;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
  text-align: center;
  color: #fff;
}

@media (hover:hover) {
  .profile__favorites-link:hover {
    color: #fff;
  }
}

@media (max-width: 600px) {
  .profile__favorites-item {
    flex-wrap: wrap;
    gap: 16px 0;
  }

  .profile__favorites-delete {
    order: 1;
    margin-left: auto;
    margin-right: 0;
  }

  .profile__favorites-link {
    max-width: 100%;
    width: 100%;
    order: 2;
  }

  .profile__favorites-delete {
    margin-right: 16px;
  }
}

.profile__content {
  transition: height 0.5s ease, max-height 0.5s ease, min-height 0.5s ease;
}

.profile__favorites-item {
  transition: all 0.4s ease;
}

.profile-responsive-link span {
  display: none;
}

@media (max-width: 991.8px) {
  .profile-responsive-link img {
    display: none;
  }

  .profile-responsive-link span {
    display: block;
  }
}

.listing-img-box {
  position: relative;
}

.listing-img-box .fav-item {
  position: absolute;
  right: 10px;
  top: 10px;
}

.listing-img-box .fav-item {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.listing-img-box .fav-item a.added i::before {
  color: #ffcd01;
}

.listing-img-box .fav-item i::before {
  font-size: 20px;
  color: #fff;
  transition: color 0.5s ease;
}

.listing-img a .img-fluid {
  width: 318px;
  height: 230px;
}

.header .main-menu-wrapper .main-nav>li ul {
  transform: translateY(-20px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}

@media (max-width: 992px) {
  .listing-item .listing-img img {
    width: 100%;
  }
}

.specification-card {
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 12px;
  box-shadow: none;
  background-color: transparent;
}

.specification-card .feature-img {
  background-color: transparent;
}

.specification-card .review-header {
  padding-bottom: 0;
}

.specification-card .featues-info {
  display: flex;
  align-items: start;
  gap: 0 10px;
  font-family: 'Montserrat', sans-serif;
}

.specification-card .featureslist:nth-child(odd) .featues-info {
  flex-wrap: wrap;
}

.specification-card .featues-info span {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.specification-card .featues-info h6 {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

@media (max-width: 630px) {
  .lisiting-featues-list {
    grid-template-columns: repeat(1, 1fr);
  }

  .specification-card .featues-info {
    gap: 4px 10px;
  }

  .featues-info {
    flex-wrap: wrap;
  }
}

.details-car-grid .section-heading {
  margin-bottom: 36px;
}

.explore-title {
  text-align: left;
  font-size: 36px;
}

@media (max-width: 768px) {
  .explore-title {
    font-size: 28px;
  }

  .product-details__banner {
    height: 250px;
  }
}

.car-container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 10px;
}

.product-details__inner {
  display: flex;
  gap: 30px;
}

.product-details__banner {
  margin-bottom: 50px;
  display: block;
  overflow: hidden;
  border-radius: 12px;
}

.product-details__banner {
  height: 272px;
  background: linear-gradient(262.35deg, #C1C1C1 -37.36%, #F7F7F7 118%);
  border-radius: 12px;
  position: relative;
}

.product-details__banner::before {
  content: '';
  position: absolute;
  display: block;
  background-image: url('../img/car-banner.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 372px;
  height: 252px;
  top: 12px;
  right: 22px;
  z-index: 1;
}

.product-details__banner::after {
  content: '';
  position: absolute;
  display: block;
  right: 0;
  bottom: 0;
  width: 356px;
  height: 272px;
  background-image: url('../img/banner-decor.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.product-details__banner-box {
  margin: 52px 30px 0;
  position: relative;
  z-index: 2;
}

.product-details__banner-title {
  font-size: 38px;
  font-weight: 600;
  max-width: 364px;
  display: block;
  line-height: 1.26;
  margin-bottom: 20px;
}

.product-details__banner-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  max-width: 280px;
  width: 100%;
  height: 52px;
  color: #fff;
  background-color: #3b3838;
  border-radius: 8px;
  border: none;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 16px;
}

.product-details__info {
  width: 100%;
}

.product-details__next {
  width: 100%;
}

@media (max-width: 768px) {
  .product-details__banner-title {
    font-size: 26px;
  }

  .product-details__banner::before {
    width: 240px;
    height: 160px;
    top: 50%;
    transform: translateY(-50%);
  }

  .product-details__banner {
    display: flex;
    align-items: center;
  }

  .product-details__banner-box {
    margin: 16px 30px;
  }

  .book-car__tabs {
    width: 100%;
  }
}

@media (max-width: 580px) {
  .product-details__banner-box {
    margin: 16px;
  }

  .product-details__banner::before {
    display: none;
  }
}

.go-to-final-form:focus {
  background-color: #FFCC00;
  color: #2a292b;
}

.btn.btn-finish-order.complete-order-btn.car-btn:active {
  background-color: #FFCC00;
}

@media (max-width: 991.8px) {
  .header .main-menu-wrapper .main-nav .has-submenu ul {
    margin-top: 10px;
    transform: translateY(0);
  }
}

.car-option-content {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-left: 22px;
} 

.profile__orders-table {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 24px;
  margin-bottom: 16px;
}

.profile__orders-table-item {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 600;
}

.profile__orders-item {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  align-items: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
}

.profile__orders-cancel {
  background-color: rgb(220, 53, 69);
  border: none;
  color: #fff;
  padding: 10px 4px;
  border-radius: 10px;
}

.profile__orders-car,
.profile__orders-date,
.profile__orders-price,
.profile__orders-status {
  font-size: 14px;
  font-weight: 500;
}

.profile__orders-status {
  display: flex;
  align-items: center;
  gap: 6px;
  line-height: 1.2;
}

.profile__orders-item:not(:last-child) {
  margin-bottom: 16px;
}

.profile__orders-img {
  border-radius: 4px;
  object-fit: cover;
}

.custom-file-upload {
  position: relative;
  display: inline-block;
  margin-top: 8px;
}

.custom-file-upload input[type="file"] {
  display: none;
}

.custom-file-upload label {
  background-color: #007bff;
  color: white;
  padding: 10px 16px;
  font-size: 14px;
  border-radius: 4px;
  cursor: pointer;
  display: inline-block;
}

.custom-file-upload label:hover {
  background-color: #0056b3;
}

#icon-file-name {
  display: inline-block;
  margin-left: 10px;
  font-style: italic;
  color: #555;
}

.icon-preview {
  margin-top: 10px;
}

.icon-preview img {
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 2px;
}

