@use "@/src/assets/scss/variables" as *;
@use "@/src/assets/scss/partial" as *;

.BookingWrapper {
  .BookingContentWrap {
    .DetailsListWrap {
      list-style: none;
      padding: 0;
      margin: 0;

      li {
        &:last-child {
          border-bottom: 0px;
          padding-bottom: 0px;
        }

        .ListNameSpan {
          color: $grey344Color;
        }

        .ListValueDiv {
          background-color: $bgColor;
          padding: 6px 14px;

          button {
            i {
              background-color: $blackColor;
            }
          }

          .AddressWrap {
            overflow-x: auto;

            @media screen and (min-width: $xsm) {
              min-width: 300px;
              max-width: 300px;
            }

            @media screen and (min-width: $lg) {
              min-width: 350px;
              max-width: 450px;
            }

            &::-webkit-scrollbar {
              width: 5px;
              height: 5px;
            }

            &::-webkit-scrollbar-track {
              background-color: $whiteColor;
              border-radius: 12px;
            }

            &::-webkit-scrollbar-thumb {
              background: $grey344Color;
              border-radius: 12px;
            }

            &::-webkit-scrollbar-thumb:hover {
              background: #555;
              border-radius: 12px;
            }

            p {
              text-align: right;

              @media screen and (min-width: $xsm) {
                width: max-content;
              }
            }
          }
        }
      }
    }

    .CardnumberInputWrap {
      .CardnumberInput {
        position: relative;

        input {
          padding-left: 57px;
        }

        &::after {
          width: 35px;
          height: 25px;
          background-image: url("../../../../../../../../../public/images/icon-visa.svg");
          background-size: contain;
          background-repeat: no-repeat;
          background-position: center;
          content: "";
          position: absolute;
          left: 15px;
          top: 50%;
          transform: translateY(-50%);
          z-index: 1;
        }
      }
    }
  }
}

// .PolicyLabel{
//   span{
//     &::before{
//       top: 0px !important;
//       transform: none !important;
//     }
//     &::after{
//       top: 4px !important;
//       left: 6px !important;
//       transform: none !important;
//     }
//   }
// }