html, body {
    /* background-color: #3e1417 !important; */
    background: rgba(62, 20, 23, 0.9);
    font-family: "Lato", sans-serif;

}

/* .navbar {
  padding-right: 108px;
  padding-left: 108px;
} */


/* Contact Page */
.contact-header {
    background: linear-gradient(to left, rgba(0, 0, 0, 0.1), rgba(62, 20, 23, 1));
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    /* color: white; */
  }

  .contact-natya {
    height: 75vh;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(62, 20, 23, 1));
    display: flex;
    align-items: center;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); /* Horizontal, vertical, blur, color */
  }

  .contact-form-card { 
    background: linear-gradient(to left, rgba(0,0,0, 0.3), rgba(62, 20, 23, 0.5));
    color: white;
    overflow: hidden;
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); /* Horizontal, vertical, blur, color */
  }

  .contact-natya > img {
    height: 100%;
  }
  

  /* Custom CSS */
.custom-input {
    background-color: #3e1417; /* background */
    color: white; /* text color */
    border: 1px solid white; /*  border */
  }

  input[type="text"] {
    color: white !important;
  }

  input[type="text"]::placeholder {
    color: white !important;
  }

  input[type="email"] {
    color: white !important;
  }

  input[type="email"]::placeholder {
    color: white !important;
  }
  
  .custom-input:focus {
    background-color: #3e1417; /* White background on focus */
    border-color: white; /* Darker blue border on focus */
    box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25); /* Bootstrap's focus shadow */
  }


  /* Change the background color of the dropdown menu */
.dropdown-menu {
    background-color: #3e1417; /* Green background */
  }
  
  /* Change the text color inside the dropdown items */
  .dropdown-item {
    color: white; /* White text */
  }
  
  /* Change the text color on hover */
  .dropdown-item:hover {
    background-color: #3e1417; /* Darker green on hover */
    color: white; /* Keep text white on hover */
  }

  .col-right-border {
    border-right: 1px solid white;
  }


  /* Custom navbar text color */
  /* .navbar .navbar-nav .nav-link {
    color: #3e1417; 
  }
  
  .navbar .navbar-brand {
    color: #3e1417; 
  }
  
  .navbar-toggler-icon {
    background-color: #3e1417; 
  } */
  

  /* Custom button text color */
/* .btn-custom {
    color: #3e1417;
  }
  
  .btn-custom:hover {
    background-color: #3e1417; 
    color: white;
  } */


  .btn-dark-gradient {
    background-image: linear-gradient(to right, rgba(0,0,0,0.5), rgba(0,0,0,0.1)); /* Gradient colors */
    color: white;
    /* border: 1px solid rgba(255, 255, 255, 0.7); */
}
  

/* floating labels */

.form-floating {
  position: relative;
}

.form-floating input {
  padding: 1.5rem 0.75rem 0.5rem;
  border: 2px solid #E8C1AB;
  border-radius: 5px;
  background-color: #3e1417;
  color: white;
  outline: none;
  transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

/* Label inside the border */
.form-floating::before {
  content: attr(data-label);
  position: absolute;
  top: -0.5rem;
  left: 0.75rem;
  background-color: #3e1417;
  color: #E8C1AB;
  padding: 0 4px;
  font-size: 0.85rem;
  pointer-events: none;
  z-index: 1;
  transition: all 0.3s ease;
}

/* Focus behavior */
.form-floating input:focus {
  box-shadow: 0 0 0 3px #007bff; /* Blue outline on focus */
  background-color: #3e1417 !important; /* Ensure background stays */
  outline: none; /* Remove default focus outline */
}

.form-floating input:focus::placeholder {
  color: transparent !important;
}

.form-floating textarea {
  background-color: #3e1417 !important;
  color: white !important;
  border: 2px solid #E8C1AB;
  scrollbar-width: none;
}

.form-floating .dropdown {
  border: 2px solid #E8C1AB;
}

@media (max-width: 767.98px){
  .questions-title {
      font-family: "Montserrat", sans-serif;
      font-size: 1.5rem !important;
      color: #E8C1AB;
    }
}
