/*
 * The few rules this site adds to the old website's style.css and responsive.css (which are served unchanged
 * next to this file). Loaded after them and after Bootstrap. Also scoped into legacy-chrome.css for the
 * Tailwind-built pages' header and footer.
 */

/* The header's "Download App" and "Login": the old site's own .btn1 .btn-pink / .login-btn buttons, which it
   had commented out, as links. */
.custom-navbar .nav-btn {
    display: inline-block;
    align-self: center;
    white-space: nowrap;
    color: #fff;
    text-decoration: none;
    line-height: 1.5;
}

.custom-navbar .nav-btn:hover {
    color: #fff;
    opacity: 0.9;
}

/* A field the form could not take, and why. */
.legacy-field-error {
    color: #dc3545 !important;
    font-size: 14px;
    margin: 6px 0 0;
}

/* Spam trap: never seen or reached by a person. */
.legacy-honeypot {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* The old success.php / failed.php message, shown in place of the form. */
.contact1 .legacy-form-result,
.form-container .legacy-form-result {
    padding: 10px 0 20px;
}

.legacy-form-result h2 {
    font-size: 24px;
}

.legacy-form-reason {
    font-size: 15px;
    margin-top: 10px;
}

/* The old contact box's select, for the deposit enquiry's product choice. */
select.contact-input {
    padding: 4px 0;
}

/* The footer's second row: the privacy policy, terms and account deletion pages. */
.footer-menu .footer-legal {
    margin-top: 0;
    margin-bottom: 8px;
}

.footer-menu .footer-legal a {
    font-size: 13px;
}

/* A loan's "Apply now" and the deposit enquiry: the contact page's two columns. */
.enquiry-section {
    margin-top: 30px;
    margin-bottom: 60px;
}

.enquiry-steps {
    padding-left: 20px;
}

.enquiry-steps li {
    font-size: 16px;
    font-family: "mulish", sans-serif;
    color: #212529;
    margin-bottom: 8px;
}

.apply-cta {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 16px;
    border-radius: 10px;
    background-color: #e6007e;
    color: #fff !important;
    font-size: 15px;
    text-decoration: none;
}

.apply-cta:hover {
    color: #fff !important;
    opacity: 0.9;
}