/* Login / register redesign (pages + modals). Overrides the theme's .tf-auth-card. */
.tf-auth-card {
    max-width: 440px;
    padding: 36px 32px 32px;
    border: 0;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(28, 28, 30, .12);
    position: relative;
    overflow: hidden;
}
.tf-auth-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; background: linear-gradient(90deg, #ffc800, #db1215); }
.tf-auth-card-header { margin-bottom: 24px; }
.tf-auth-card-title { font-family: "Poppins", sans-serif; font-size: 26px; font-weight: 700; color: #1c1c1e; }
.tf-auth-card-subtitle { font-size: 14px; color: #6b6b73; margin: 0; }
.tf-auth-card .tf-field-input,
.tf-login-form .tf-field-input { height: 52px; border: 1.5px solid #e5e5ea; border-radius: 12px; background: #fafafc; transition: border-color .15s, box-shadow .15s, background .15s; }
.tf-auth-card .tf-field-input:focus,
.tf-login-form .tf-field-input:focus { border-color: #ffc800; background: #fff; box-shadow: 0 0 0 4px rgba(255, 200, 0, .22); outline: 0; }
.tf-auth-card .tf-field-input.is-invalid, .tf-login-form .tf-field-input.is-invalid { border-color: #db1215; }
.tf-auth-card .tf-btn.btn-fill,
.tf-login-form .tf-btn.btn-fill { background: #ffc800; border-color: #ffc800; color: #1c1c1e; border-radius: 12px; height: 52px; font-weight: 700; transition: background .15s, transform .1s; }
.tf-auth-card .tf-btn.btn-fill:hover,
.tf-login-form .tf-btn.btn-fill:hover { background: #e6b400; border-color: #e6b400; color: #1c1c1e; }
.tf-auth-card .tf-btn.btn-fill:active,
.tf-login-form .tf-btn.btn-fill:active { transform: translateY(1px); }
.tf-auth-card .tf-btn-google,
.tf-login-form .tf-btn-google { height: 50px; border: 1.5px solid #e5e5ea; border-radius: 12px; font-weight: 600; background: #fff; color: #1c1c1e; }
.tf-auth-card .tf-btn-google:hover,
.tf-login-form .tf-btn-google:hover { background: #fafafc; border-color: #cfcfd6; color: #1c1c1e; }
.tf-auth-card .btn-link.link, .tf-login-form .btn-link.link { font-size: 13.5px; text-decoration: none; color: #1c1c1e; }
.tf-auth-card .btn-link.link:hover, .tf-login-form .btn-link.link:hover { color: #db1215; }
.tf-auth-card .invalid-feedback, .tf-login-form .invalid-feedback { color: #db1215; font-size: 12.5px; }
.tf-auth-perks { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 16px; margin: 18px 0 0; padding: 0; list-style: none; font-size: 12.5px; color: #6b6b73; }
.tf-auth-perks li::before { content: "\2713\00a0"; color: #2e7d32; font-weight: 700; }

/* +91 mobile number field */
.tf-phone-field { margin-bottom: 16px; }
.tf-phone-label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: #1c1c1e; }
.tf-phone-wrap { display: flex; align-items: stretch; height: 52px; border: 1.5px solid #e5e5ea; border-radius: 12px; background: #fafafc; overflow: hidden; transition: border-color .15s, box-shadow .15s, background .15s; }
.tf-phone-wrap:focus-within { border-color: #ffc800; background: #fff; box-shadow: 0 0 0 4px rgba(255, 200, 0, .22); }
.tf-phone-field.is-invalid .tf-phone-wrap { border-color: #db1215; }
.tf-phone-prefix { display: flex; align-items: center; padding: 0 14px; font-weight: 700; background: #f1f1f5; border-right: 1.5px solid #e5e5ea; font-family: "Open Sans", sans-serif; }
.tf-phone-input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 0 14px; font-size: 15px; font-family: "Open Sans", sans-serif; letter-spacing: .5px; outline: 0; }
.tf-phone-help { font-size: 12px; color: #8a8a93; margin-top: 5px; }

@media (max-width: 575px) { .tf-auth-card { padding: 30px 20px 24px; border-radius: 16px; } }