/* =========================================================
   Membership Pro - Checkout Title Area
   DMS-style heading, no title card/box
   File: membership-pro.css
   ========================================================= */

/* Main title wrapper */
#osm-singup-page #membership-type-info,
#osm-singup-page #membership-type-info.bg_boxgray {
  width: 100% !important;
  max-width: 1040px !important;
  margin: 0 auto 28px !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;

  text-align: center !important;
}

/* Subtitle, e.g. "Membership Subscription" */
#osm-singup-page #membership-type-info .sp_boxtitle {
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: #607d8b !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-align: center !important;
  text-transform: none !important;
}

/* Space between subtitle and title */
#osm-singup-page #membership-type-info > .sp_boxcontent {
  display: block !important;

  margin: 8px 0 0 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  text-align: center !important;
  box-sizing: border-box !important;
}

/* Inner custom wrapper */
#osm-singup-page #membership-type-info .sp_boxcontent .custom {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

/* Main plan/product title */
#osm-singup-page #membership-type-info .membershiptitle,
#osm-singup-page #membership-type-info .sp_boxcontent .membershiptitle,
#osm-singup-page #membership-type-info h1.membershiptitle {
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  text-transform: none !important;
}

/* =========================================================
   Membership Pro - Create Account Card
   ========================================================= */

#osm-singup-page #membership-register-default,
#osm-singup-page #membership-register-default.bg_boxgray {
  width: 100% !important;
  max-width: 1040px !important;
  margin: 0 auto 28px !important;
  padding: 0 !important;

  background: #ffffff !important;
  border: 1px solid #d8e1e7 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 18px rgba(38, 50, 56, 0.055) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Card heading */
#osm-singup-page #membership-register-default > .sp_boxtitle {
  margin: 0 !important;
  padding: 24px 30px 8px !important;

  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  text-align: left !important;
  text-transform: none !important;
}

/* Already have account prompt */
#osm-singup-page #membership-register-default .tt-osm-login-prompt {
  float: right !important;

  margin: -34px 30px 0 0 !important;
  padding: 0 !important;

  border-bottom: 0 !important;

  color: #607d8b !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  text-align: right !important;
}


#osm-singup-page #membership-register-default .tt-osm-login-prompt a {
  color: #247e99 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

#osm-singup-page #membership-register-default .tt-osm-login-prompt a:hover,
#osm-singup-page #membership-register-default .tt-osm-login-prompt a:focus {
  color: #1b6f88 !important;
  text-decoration: underline !important;
}

/* Field content area */
#osm-singup-page #membership-register-default > .sp_boxcontent {
  clear: both !important;
  padding: 28px 30px 30px !important;
  border-top: 1px solid #eef2f5 !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
}

/* Field rows */
#osm-singup-page #membership-register-default .control-group,
#osm-singup-page #membership-register-default .form-group {
  margin: 0 0 18px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Labels */
#osm-singup-page #membership-register-default .control-label,
#osm-singup-page #membership-register-default .form-label {
  margin: 0 0 7px !important;
  padding: 0 !important;

  color: #455a64 !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

/* Controls wrapper */
#osm-singup-page #membership-register-default .controls {
  margin: 0 !important;
  padding: 0 !important;
}

/* Inputs/selects */
#osm-singup-page #membership-register-default input[type="text"],
#osm-singup-page #membership-register-default input[type="email"],
#osm-singup-page #membership-register-default input[type="password"],
#osm-singup-page #membership-register-default input[type="tel"],
#osm-singup-page #membership-register-default input[type="number"],
#osm-singup-page #membership-register-default select,
#osm-singup-page #membership-register-default textarea {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 46px !important;

  margin: 0 !important;
  padding: 10px 13px !important;

  background: #f8fafb !important;
  border: 1px solid #d8e1e7 !important;
  border-radius: 8px !important;
  box-shadow: none !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;

  box-sizing: border-box !important;
  transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease !important;
}

/* Textarea */
#osm-singup-page #membership-register-default textarea {
  min-height: 92px !important;
  resize: vertical !important;
}

/* Focus state */
#osm-singup-page #membership-register-default input[type="text"]:focus,
#osm-singup-page #membership-register-default input[type="email"]:focus,
#osm-singup-page #membership-register-default input[type="password"]:focus,
#osm-singup-page #membership-register-default input[type="tel"]:focus,
#osm-singup-page #membership-register-default input[type="number"]:focus,
#osm-singup-page #membership-register-default select:focus,
#osm-singup-page #membership-register-default textarea:focus {
  background: #ffffff !important;
  border-color: #247e99 !important;
  box-shadow: 0 0 0 3px rgba(36, 126, 153, 0.12) !important;
  outline: none !important;
}

/* Required asterisk */
#osm-singup-page #membership-register-default .required {
  color: #d85f7a !important;
  font-weight: 700 !important;
}

/* Remove old/empty row columns from previous override */
#osm-singup-page #membership-register-default .row:empty,
#osm-singup-page #membership-register-default #leftinforegister:empty,
#osm-singup-page #membership-register-default #rightinforegister:empty {
  display: none !important;
}

/* =========================================================
   Membership Pro - Optional Billing Dropdown
   Simple inline version
   ========================================================= */

#osm-singup-page .tt-osm-optional-billing {
  margin: 4px 0 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* Summary/link row */
#osm-singup-page .tt-osm-optional-billing summary {
  cursor: pointer !important;
  list-style: none !important;

  display: inline-flex !important;
  align-items: center !important;

  margin: 0 0 18px !important;
  padding: 0 !important;

  color: #247e99 !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  user-select: none !important;
}

#osm-singup-page .tt-osm-optional-billing summary::-webkit-details-marker {
  display: none !important;
}

/* Plus/minus icon */
#osm-singup-page .tt-osm-optional-billing summary::before {
  content: "+" !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 18px !important;
  height: 18px !important;
  margin-right: 8px !important;

  border-radius: 50% !important;
  background: #247e99 !important;
  color: #ffffff !important;

  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

#osm-singup-page .tt-osm-optional-billing[open] summary::before {
  content: "−" !important;
}

/* Optional fields continue as normal form fields */
#osm-singup-page .tt-osm-optional-billing-fields {
  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Slight spacing after opening */
#osm-singup-page .tt-osm-optional-billing[open] .tt-osm-optional-billing-fields {
  padding-top: 2px !important;
}

/* =========================================================
   Membership Pro - Mobile
   ========================================================= */

@media (max-width: 767.98px) {
  /* Title area */
  #osm-singup-page #membership-type-info,
  #osm-singup-page #membership-type-info.bg_boxgray {
    margin: 0 auto 24px !important;
    padding: 0 8px !important;
  }

  #osm-singup-page #membership-type-info > .sp_boxcontent {
    margin-top: 8px !important;
  }

  #osm-singup-page #membership-type-info .sp_boxtitle {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  #osm-singup-page #membership-type-info .membershiptitle,
  #osm-singup-page #membership-type-info .sp_boxcontent .membershiptitle,
  #osm-singup-page #membership-type-info h1.membershiptitle {
    font-size: 28px !important;
    line-height: 1.18 !important;
  }

  /* Account card */
  #osm-singup-page #membership-register-default,
  #osm-singup-page #membership-register-default.bg_boxgray {
    margin: 0 auto 24px !important;
    border-radius: 10px !important;
  }

  #osm-singup-page #membership-register-default > .sp_boxtitle {
    padding: 21px 18px 7px !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
  }

  #osm-singup-page #membership-register-default .tt-osm-login-prompt {
  float: none !important;

  margin: -4px 18px 0 !important;
  padding: 0 0 16px !important;

  text-align: left !important;
  font-size: 13.5px !important;
}

  #osm-singup-page #membership-register-default > .sp_boxcontent {
    padding: 22px 18px 24px !important;
  }

  #osm-singup-page #membership-register-default .control-group,
  #osm-singup-page #membership-register-default .form-group {
    margin-bottom: 16px !important;
  }

  #osm-singup-page #membership-register-default .control-label,
  #osm-singup-page #membership-register-default .form-label {
    margin-bottom: 6px !important;
    font-size: 13.5px !important;
  }

  #osm-singup-page #membership-register-default input[type="text"],
  #osm-singup-page #membership-register-default input[type="email"],
  #osm-singup-page #membership-register-default input[type="password"],
  #osm-singup-page #membership-register-default input[type="tel"],
  #osm-singup-page #membership-register-default input[type="number"],
  #osm-singup-page #membership-register-default select,
  #osm-singup-page #membership-register-default textarea {
    min-height: 44px !important;
    padding: 9px 12px !important;
    font-size: 14px !important;
    border-radius: 8px !important;
  }

  /* Optional billing */
  #osm-singup-page .tt-osm-optional-billing {
    margin-top: 2px !important;
  }

  #osm-singup-page .tt-osm-optional-billing summary {
    margin-bottom: 16px !important;
    padding: 0 !important;
    font-size: 14px !important;
  }

  #osm-singup-page .tt-osm-optional-billing summary::before {
    width: 18px !important;
    height: 18px !important;
    margin-right: 8px !important;
    font-size: 14px !important;
  }

  #osm-singup-page .tt-osm-optional-billing-fields {
    padding: 0 !important;
  }
}

/* Small mobile */
@media (max-width: 480px) {
  #osm-singup-page #membership-type-info,
  #osm-singup-page #membership-type-info.bg_boxgray {
    margin-bottom: 22px !important;
  }

  #osm-singup-page #membership-type-info > .sp_boxcontent {
    margin-top: 7px !important;
  }

  #osm-singup-page #membership-type-info .membershiptitle,
  #osm-singup-page #membership-type-info .sp_boxcontent .membershiptitle,
  #osm-singup-page #membership-type-info h1.membershiptitle {
    font-size: 26px !important;
  }
}

/* =========================================================
   Membership Pro - Small Payment Fixes
   Safe version - does not force hidden fields visible
   ========================================================= */

/* Keep payment card full width like the account card */
#osm-singup-page #membership-register-paymeent,
#osm-singup-page #membership-register-paymeent.bg_boxgray {
  width: 100% !important;
  max-width: 1040px !important;
  margin: 0 auto 28px !important;
  padding: 0 !important;

  background: #ffffff !important;
  border: 1px solid #d8e1e7 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 18px rgba(38, 50, 56, 0.055) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Heading */
#osm-singup-page #membership-register-paymeent > .sp_boxtitle {
  margin: 0 !important;
  padding: 24px 30px 18px !important;

  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid #eef2f5 !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  text-align: left !important;
  text-transform: none !important;
}

/* Override old narrow payment content, but do NOT change row display */
#osm-singup-page form #membership-register-paymeent .sp_boxcontent {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-left: 0 !important;
  padding: 28px 30px 30px !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
}

/* Payment labels */
#osm-singup-page #membership-register-paymeent .control-label {
  color: #455a64 !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* Payment text */
#osm-singup-page #membership-register-paymeent .controls {
  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

/* Fix the price input group */
#osm-singup-page #membership-register-paymeent .osm-addon-container.input-group {
  display: inline-flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;

  width: auto !important;
  max-width: 190px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Fix old rule that floated the price input */
#osm-singup-page #membership-register-paymeent .osm-addon-container.input-group input[type="text"] {
  float: none !important;
  clear: none !important;

  width: 130px !important;
  max-width: 130px !important;
  height: 46px !important;
  min-height: 46px !important;

  margin: 0 !important;
  padding: 10px 13px !important;

  background: #f8fafb !important;
  border: 1px solid #d8e1e7 !important;
  border-left: 0 !important;
  border-radius: 0 8px 8px 0 !important;
  box-shadow: none !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  box-sizing: border-box !important;
}

/* Dollar symbol */
#osm-singup-page #membership-register-paymeent .osm-addon-container.input-group .input-group-text {
  float: none !important;
  clear: none !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 42px !important;
  min-width: 42px !important;
  height: 46px !important;
  min-height: 46px !important;

  margin: 0 !important;
  padding: 0 !important;

  background: #f3f7f9 !important;
  border: 1px solid #d8e1e7 !important;
  border-right: 0 !important;
  border-radius: 8px 0 0 8px !important;

  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}

/* Lightly improve payment method radio spacing only */
#osm-singup-page #membership-register-paymeent input[type="radio"] {
  margin: 0 7px 0 0 !important;
  position: relative !important;
  top: 1px !important;
}

#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls {
  padding-top: 2px !important;
}

#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls label,
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls span {
  color: #37474f !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
}

/* Mobile */
@media (max-width: 767.98px) {
  #osm-singup-page #membership-register-paymeent,
  #osm-singup-page #membership-register-paymeent.bg_boxgray {
    margin: 0 auto 24px !important;
    border-radius: 10px !important;
  }

  #osm-singup-page #membership-register-paymeent > .sp_boxtitle {
    padding: 21px 18px 17px !important;
    font-size: 22px !important;
  }

  #osm-singup-page form #membership-register-paymeent .sp_boxcontent {
    padding: 22px 18px 24px !important;
  }

  #osm-singup-page #membership-register-paymeent .osm-addon-container.input-group input[type="text"] {
    width: 125px !important;
    max-width: 125px !important;
    height: 44px !important;
    min-height: 44px !important;
    font-size: 14px !important;
  }

  #osm-singup-page #membership-register-paymeent .osm-addon-container.input-group .input-group-text {
    height: 44px !important;
    min-height: 44px !important;
  }
}

/* =========================================================
   Membership Pro - Final Payment Tidying
   Simple direct fixes
   ========================================================= */

/* Move only the $29.99 price box left */
#osm-singup-page #membership-register-paymeent .osm-addon-container.input-group {
  transform: translateX(-135px) !important;
}

/* Payment method text should not be so bold */
#osm-singup-page #membership-register-paymeent .controls label,
#osm-singup-page #membership-register-paymeent .controls span {
  font-weight: 500 !important;
}

/* Keep the selected method slightly stronger only */
#osm-singup-page #membership-register-paymeent input[type="radio"]:checked + label,
#osm-singup-page #membership-register-paymeent input[type="radio"]:checked + span {
  font-weight: 600 !important;
}

/* Slightly tighten radio option spacing */
#osm-singup-page #membership-register-paymeent input[type="radio"] {
  margin-right: 7px !important;
}

/* Mobile: don't pull the price box left */
@media (max-width: 767.98px) {
  #osm-singup-page #membership-register-paymeent .osm-addon-container.input-group {
    transform: none !important;
  }
}

/* =========================================================
   Membership Pro - Payment Method Final Tidy
   ========================================================= */

/* Move the payment method options left to align better with the price box */
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls {
  transform: translateX(-135px) !important;
}

/* Override earlier bold payment method styling */
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls,
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls label,
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls span,
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls strong,
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls b {
  font-weight: 500 !important;
}

/* Move the payment method row up slightly */
#osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) {
  margin-top: -4px !important;
}

/* Mobile: don't pull payment methods left */
@media (max-width: 767.98px) {
  #osm-singup-page #membership-register-paymeent .control-group:has(input[type="radio"]) .controls {
    transform: none !important;
  }
}
