/* This file contains all the styles for the pop-up quote request modal.
*/

/* --- Main Button Styling --- */
#open-quote-btn {
      /* Styling copied from #header_cta */
      background-color: #E63D2F;
      border-radius: 4px;
      border: none;
      color: white;
      font-family: 'Franklin_Demi', 'Libre Franklin', sans-serif;
      display: inline-block;
      transition: transform .2s;
      cursor: pointer;

      /* CORRECTED padding and font size for this specific button */
      padding: 0px 0px 0px 0px;
      font-size: 25px;
}

#open-quote-btn:hover {
  /*transform: scale(1.05);*/
}

/* Container for the button on the page */
.red_button {
  text-align: center;
  max-width: 275px;
  margin: auto;
}


/* --- Modal Styles --- */
#quote-modal.modal-overlay {
    display: none; /* Hidden by default */
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Darkened the overlay slightly */
    justify-content: center;
    align-items: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #435464; /* Changed default text color to site's dark blue */
}

#quote-modal .modal-content {
    background-color: #eae3d5; /* Changed background to match site beige */
    padding: 30px;
    border-radius: 8px;
    width: 90%;
    max-width: 500px;
    position: relative;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3); /* Added a subtle shadow back */
}

#quote-modal .close-btn {
    color: #aaa;
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}

#quote-modal .close-btn:hover {
    color: #435464;
}

/* --- Form Styles --- */
#quote-modal .form-page h2 {
    font-family: 'Franklin_Demi', 'Libre Franklin', sans-serif;
    color: #E63D2F; /* Changed heading to site's red */
    font-size: 31px;
    margin-top: 0;
}

#quote-modal .form-text {
    font-family: 'Cheltenham_Book', 'Arbutus Slab', serif;
    font-size: 18px;
    color: #435464;
    margin-bottom: 15px;
}

#quote-modal .form-group {
    margin-bottom: 20px;
}

#quote-modal .form-group label {
    display: block;
    padding: 15px;
    border: 1px solid #435464;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: border-color 0.3s, background-color 0.3s;
    font-family: 'Cheltenham_Book', 'Arbutus Slab', serif;
    font-size: 19px; /* MODIFIED: Was 18px */
    font-weight: normal;
}

#quote-modal .form-group input[type="radio"] {
    display: none;
}

#quote-modal .form-group input[type="radio"]:checked + label {
    border-color: #435464; /* UPDATED from red to dark blue */
    background-color: #fff;
    border-width: 2px; /* Make selection more prominent */
    font-weight: bold;
}

#quote-modal .form-navigation {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

#quote-modal .form-navigation button {
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    font-size: 1.3rem;
    cursor: pointer;
    font-family: 'Franklin_Demi', 'Libre Franklin', sans-serif;
    transition: none;
    transform: none;
}

#quote-modal .form-navigation button:hover {
    transform: none;
    opacity: 0.9;
}

/* Made this selector more specific to override site styles */
#quote-modal .form-navigation .btn-secondary {
    background-color: #E63D2F;
    background-image: none; /* Add this line */
    color: white;
}

/* Made this selector more specific to override site styles */
#quote-modal .form-navigation .btn-primary {
    background-color: #E63D2F;
    background-image: none; /* Add this line */
    color: white;
}

/* --- Form Input & Error Styling --- */
#quote-modal .form-control {
    width: 100%;
    padding: 10px 15px;
    margin-bottom: 10px;
    border: 1px solid #435464; /* Changed border to dark blue */
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 16px;
}

#quote-modal .error-message {
    color: #E63D2F;
    font-size: 1.1em;
    font-family: 'Franklin_Book', 'Libre Franklin', sans-serif;
    padding-top: 5px;
    min-height: 1.2em;
}

#quote-modal .error-message.radio-error {
    margin-top: -10px; /* Adjust spacing for radio button errors */
    margin-bottom: 10px;
}

/* --- Helper class used by JavaScript --- */
#quote-modal .hidden {
    display: none;
}

/* --- Custom File Input Styles --- */

/* Hide the default file input */
.file-input-hidden {
    display: none;
}

/* Style the new label to look like a button */
.file-input-label {
    display: inline-block;
    padding: 10px 20px;
    background-color: #E63D2F; /* Site's red color */
    color: white;
    font-family: 'Franklin_Demi', 'Libre Franklin', sans-serif;
    border-radius: 5px;
    cursor: pointer;
    transition: opacity 0.2s;
}

.file-input-label:hover {
    opacity: 0.9;
}

/* Style the text that displays the file name */
.file-name {
    margin-left: 15px;
    font-family: 'Cheltenham_Book', 'Arbutus Slab', serif;
    color: #435464; /* Site's dark blue */
}