/*
Vegas Mop Bosses Client Login / Ultimate Member CSS
Upload to: /wp-content/uploads/vmb-css/client-login.css
Recommended wrappers:
Login page intro: <section class="vmb-login-intro">
Password reset page intro: <section class="vmb-um-page vmb-password-reset-page">
*/

.vmb-login-intro,
.vmb-um-page {
  --vmb-pink: #FF6B6D;
  --vmb-pink-dark: #e85255;
  --vmb-pink-soft: #fff0f1;
  --vmb-pink-light: #ffd9da;
  --vmb-heading: #202020;
  --vmb-muted: #555555;
  font-family: Arial, Helvetica, sans-serif;
  color: #2b2b2b;
  text-align: center;
  box-sizing: border-box;
}

.vmb-login-intro *,
.vmb-login-intro *::before,
.vmb-login-intro *::after,
.vmb-um-page *,
.vmb-um-page *::before,
.vmb-um-page *::after {
  box-sizing: border-box;
}

.vmb-login-intro {
  max-width: 720px;
  margin: 40px auto 24px;
  padding: 40px 22px 10px;
}

.vmb-um-page {
  background:
    radial-gradient(circle at top left, rgba(255, 107, 109, 0.28) 0%, rgba(255, 107, 109, 0.10) 34%, transparent 62%),
    radial-gradient(circle at bottom right, rgba(255, 107, 109, 0.18) 0%, rgba(255, 107, 109, 0.07) 32%, transparent 60%),
    linear-gradient(135deg, #fff0f1 0%, #fff7f7 45%, #ffffff 100%);
  border-radius: 32px 32px 0 0;
  max-width: 960px;
  margin: 28px auto 0;
  padding: 58px 22px 24px;
  overflow: hidden;
}

.vmb-login-intro .vmb-eyebrow,
.vmb-um-page .vmb-eyebrow {
  display: inline-block;
  margin-bottom: 18px;
  background: #ffffff;
  color: var(--vmb-pink);
  border: 1px solid var(--vmb-pink-light);
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3px;
  box-shadow: 0 6px 18px rgba(255, 107, 109, 0.14);
}

.vmb-login-intro h1,
.vmb-um-page h1,
.vmb-um-intro h1 {
  color: var(--vmb-heading);
  font-size: clamp(34px, 5vw, 52px);
  line-height: 1.08;
  margin: 0 0 14px;
  font-weight: 900;
}

.vmb-login-intro p,
.vmb-um-page p,
.vmb-um-intro p {
  max-width: 620px;
  margin: 0 auto;
  color: var(--vmb-muted);
  font-size: 17px;
  line-height: 1.7;
}

/* Optional wrapper if you add <main class="vmb-login-page"> around the UM shortcode */

.vmb-login-page {
  background:
    radial-gradient(circle at top left, rgba(255, 107, 109, 0.22) 0%, rgba(255, 107, 109, 0.08) 34%, transparent 62%),
    linear-gradient(135deg, #fff0f1 0%, #fff7f7 48%, #ffffff 100%);
  border-radius: 32px;
  overflow: hidden;
  max-width: 960px;
  margin: 28px auto;
  padding: 10px 20px 48px;
  box-shadow: 0 18px 46px rgba(255, 107, 109, 0.12);
}

/* Ultimate Member form styling - scoped when wrapper is available */

.vmb-login-page .um,
.vmb-password-reset-page ~ .um,
.vmb-um-page ~ .um {
  max-width: 520px !important;
  margin: 0 auto !important;
  font-family: Arial, Helvetica, sans-serif;
}

.vmb-login-page .um-form,
.vmb-password-reset-page ~ .um .um-form,
.vmb-um-page ~ .um .um-form {
  background: #ffffff;
  border: 1px solid #ffdfe0;
  border-radius: 24px;
  padding: 28px !important;
  box-shadow: 0 14px 34px rgba(255, 107, 109, 0.11);
}

.vmb-login-page .um-field-label label,
.vmb-password-reset-page ~ .um .um-field-label label,
.vmb-um-page ~ .um .um-field-label label {
  font-weight: 900 !important;
  color: #333333 !important;
}

.vmb-login-page .um input[type="text"],
.vmb-login-page .um input[type="password"],
.vmb-login-page .um input[type="email"],
.vmb-password-reset-page ~ .um input[type="text"],
.vmb-password-reset-page ~ .um input[type="password"],
.vmb-password-reset-page ~ .um input[type="email"],
.vmb-um-page ~ .um input[type="text"],
.vmb-um-page ~ .um input[type="password"],
.vmb-um-page ~ .um input[type="email"] {
  border-radius: 14px !important;
  border: 1px solid #e8e8e8 !important;
  padding: 12px 14px !important;
  font-size: 16px !important;
}

.vmb-login-page .um input[type="submit"],
.vmb-login-page .um-button,
.vmb-password-reset-page ~ .um input[type="submit"],
.vmb-password-reset-page ~ .um-button,
.vmb-um-page ~ .um input[type="submit"],
.vmb-um-page ~ .um-button {
  background: #FF6B6D !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  box-shadow: 0 10px 24px rgba(255, 107, 109, 0.28) !important;
  border: none !important;
}

.vmb-login-page .um-button:hover,
.vmb-login-page .um input[type="submit"]:hover,
.vmb-password-reset-page ~ .um-button:hover,
.vmb-password-reset-page ~ .um input[type="submit"]:hover,
.vmb-um-page ~ .um-button:hover,
.vmb-um-page ~ .um input[type="submit"]:hover {
  background: #e85255 !important;
  color: #ffffff !important;
}

.vmb-login-page .um a,
.vmb-password-reset-page ~ .um a,
.vmb-um-page ~ .um a {
  color: #FF6B6D !important;
  font-weight: 800;
}

/* Fallback for older page setup using :has. Keep this so your existing page still works. */

body.page .entry-content:has(.vmb-login-intro) {
  background:
    radial-gradient(circle at top left, rgba(255, 107, 109, 0.22) 0%, rgba(255, 107, 109, 0.08) 34%, transparent 62%),
    linear-gradient(135deg, #fff0f1 0%, #fff7f7 48%, #ffffff 100%);
  border-radius: 32px;
  overflow: hidden;
  max-width: 960px;
  margin: 28px auto;
  padding: 10px 20px 48px;
  box-shadow: 0 18px 46px rgba(255, 107, 109, 0.12);
}

body.page .entry-content:has(.vmb-login-intro) .um,
body:has(.vmb-password-reset-page) .entry-content > .um {
  max-width: 520px !important;
  margin: 0 auto !important;
  font-family: Arial, Helvetica, sans-serif;
}

body.page .entry-content:has(.vmb-login-intro) .um-form,
body:has(.vmb-password-reset-page) .entry-content > .um .um-form {
  background: #ffffff;
  border: 1px solid #ffdfe0;
  border-radius: 24px;
  padding: 28px !important;
  box-shadow: 0 14px 34px rgba(255, 107, 109, 0.11);
}

body.page .entry-content:has(.vmb-login-intro) .um-field-label label,
body:has(.vmb-password-reset-page) .um-field-label label {
  font-weight: 900 !important;
  color: #333333 !important;
}

body.page .entry-content:has(.vmb-login-intro) .um input[type="text"],
body.page .entry-content:has(.vmb-login-intro) .um input[type="password"],
body.page .entry-content:has(.vmb-login-intro) .um input[type="email"],
body:has(.vmb-password-reset-page) .um input[type="text"],
body:has(.vmb-password-reset-page) .um input[type="email"],
body:has(.vmb-password-reset-page) .um input[type="password"] {
  border-radius: 14px !important;
  border: 1px solid #e8e8e8 !important;
  padding: 12px 14px !important;
  font-size: 16px !important;
}

body.page .entry-content:has(.vmb-login-intro) .um input[type="submit"],
body.page .entry-content:has(.vmb-login-intro) .um-button,
body:has(.vmb-password-reset-page) .um input[type="submit"],
body:has(.vmb-password-reset-page) .um-button {
  background: #FF6B6D !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  box-shadow: 0 10px 24px rgba(255, 107, 109, 0.28) !important;
  border: none !important;
}

body.page .entry-content:has(.vmb-login-intro) .um-button:hover,
body:has(.vmb-password-reset-page) .um-button:hover {
  background: #e85255 !important;
  color: #ffffff !important;
}

/* Mobile */

@media (max-width: 768px) {
  .vmb-login-page,
  body.page .entry-content:has(.vmb-login-intro) {
    border-radius: 22px;
    margin: 14px 10px;
    padding: 4px 14px 34px;
  }

  .vmb-login-intro {
    padding: 34px 12px 8px;
    margin-top: 20px;
  }

  .vmb-login-intro p,
  .vmb-um-page p,
  .vmb-um-intro p {
    font-size: 16px;
  }

  .vmb-um-page {
    border-radius: 22px 22px 0 0;
    margin: 14px 10px 0;
    padding: 42px 18px 20px;
  }

  .vmb-login-page .um-form,
  .vmb-password-reset-page ~ .um .um-form,
  .vmb-um-page ~ .um .um-form,
  body.page .entry-content:has(.vmb-login-intro) .um-form,
  body:has(.vmb-password-reset-page) .entry-content > .um .um-form {
    padding: 24px 20px !important;
    border-radius: 20px;
  }
}