@layer utilities {
  .site_list li {
    margin: 0.5rem;
    border-bottom: #ddd 1px solid;
    padding: 0.8rem 0;
  }

  .site_list li a:hover {
    color: #ec1010;
  }

  .checkList li:last-child {
    border-bottom: none;
  }

  .site_list2 li {
    margin: 0.5rem;
    padding: 0.5rem 0;
  }
}

@layer base {
  h1 {
    @apply font-bebas;
  }
  h2 {
    @apply text-primary font-bebas;
  }
  p {
    @apply text-gray-600;
  }
  .subTitle {
    @apply font-bebas;
  }
  .rating {
    @apply text-yellow-500;
  }

  /* CF7 Styles */
  .wpcf7-form-container {
    @apply relative z-0 w-full bg-[#fff] p-5 md:p-10 shadow-xl mt-5 md:mt-0;
  }

  .wpcf7 {
    @apply grid grid-cols-12 gap-0 md:gap-x-10;
  }

  .wpcf7 p {
    @apply m-0 p-0;
  }

  .wpcf7-form-control-wrap {
    @apply relative z-0 mb-4 block;
  }

  .wpcf7-form-control {
    @apply block py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-gray-300 appearance-none dark:text-white dark:border-gray-600 dark:focus:border-primary focus:outline-none focus:ring-0 focus:border-primary peer;
  }

  .wpcf7-form-control:focus {
    @apply border-primary;
  }

  .wpcf7-form-control.textarea {
    @apply h-20 resize-none;
  }

  .wpcf7-form-control.datepicker {
    @apply block py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-gray-300 dark:text-white dark:border-gray-600 dark:focus:border-primary focus:outline-none focus:ring-0 focus:border-primary peer;
  }

  .wpcf7-submit {
    @apply py-4 px-8 mt-6 text-md text-white focus:outline-none bg-primary hover:bg-secondary hover:text-white transition-colors font-bold inline-block;
  }

  .wpcf7-response-output {
    @apply mt-4 text-sm text-gray-600 dark:text-gray-400 border-2 p-2;
  }

  .wpcf7-not-valid-tip {
    @apply text-red-500 text-sm block mt-1;
  }

  /* Time Field Icon */
  .wpcf7-form-control-wrap.time-transfer .absolute {
    @apply inset-y-0 end-0 top-0 flex items-center pe-3.5 pointer-events-none;
  }

  .wpcf7-form-control-wrap.time-transfer .absolute svg {
    @apply w-4 h-4 text-gray-500 dark:text-gray-400;
  }

  /* Footer and Other Sections */
  footer {
    @apply relative z-0 mt-10 pt-10 bg-black clear-both;
  }

  .map-container,
  .brands {
    @apply overflow-hidden;
  }

  .map-container iframe {
    @apply w-full h-full;
  }

  .swiper {
    @apply w-full overflow-hidden;
  }

  .swiper-slide {
    @apply flex justify-center items-center;
  }

  /* Newsletter Form in Footer */
  footer .relative.my-8 {
    @apply relative flex items-center;
  }

  footer .wpcf7-form-control {
    @apply bg-transparent border-b border-gray-600 text-gray-600 text-sm w-full px-8 h-10 focus:outline-none focus:border-primary;
  }

  footer .wpcf7-submit {
    @apply absolute top-2 right-0 text-white cursor-pointer;
  }
}