/* mw-mepr-native 1.0.0: MemberPress classic login, checkout and thank-you views inside Foodica's full-width template.
   Foodica sets html { font-size: 10px }, so sizes are in px. Tokens, the panel and the theme-shell rules live on
   body.mw-native-mepr; every form, button, label, error and invoice rule is scoped to .mwn-card, because on /login/
   the Popup Maker popup renders a second, identical classic form that must keep its own look. Loaded after
   MemberPress's css/ui/theme.css, css/signup.css, css/ui/login.css and after Foodica's style.css.
   Rules this sheet has to beat (spec 3.3, review M6, M8): login.css .mp_login_form input[type=submit] (0,2,1);
   theme.css .mp_wrapper label { width: 100% !important }, .mp_wrapper .mp-form-row label { display: inline !important },
   .mepr_error { background-color, border !important; padding, margin-bottom !important }, table.mp-table cell borders
   (border-width !important), .mepr_price children { display: inline !important }; Foodica label { display: block },
   input[type=text|email|submit] { margin-bottom: 20px }, button, input[type=submit] { background #363940, radius 3px },
   .entry-content p { margin-bottom: 28px; line-height: 1.8 }, .entry-content ul li { list-style-type: square },
   .entry-content a { font-weight: 600 } and the customizer's body, p { font-size: 20px }; theme.css's radios group rules
   (.mepr-radios-field, .mepr-radios-field-row, label.mepr-form-radios-label, all !important) on the EU VAT rows. */

body.mw-native-mepr {
  --mwn-ink: #1f2328;
  --mwn-muted: #5f6570;
  --mwn-blue: #06429e;
  --mwn-blue-dark: #052c72;
  --mwn-blue-soft: #e7eefc;
  --mwn-ground: #f6f8fb;
  --mwn-surface: #ffffff;
  --mwn-line: #e3e8ef;
  --mwn-red: #b42318;
  --mwn-red-soft: #fdecea;
  --mwn-green: #067647;
  --mwn-radius: 20px;
  --mwn-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 10px 30px rgba(16, 24, 40, 0.08);
  --mwn-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Theme shell */
body.mw-native-mepr .entry-header { display: none; }
body.mw-native-mepr #fig-floating-widget { display: none !important; }
body.mw-native-mepr .entry-content { padding-bottom: 0; }
body.mw-native-mepr .mwn-page {
  box-sizing: border-box;
  margin: 0 0 40px;
  padding: 8px 12px 40px;
  background: var(--mwn-ground);
  border-radius: 18px;
  color: var(--mwn-ink);
  font-family: var(--mwn-font);
  -webkit-font-smoothing: antialiased;
}
body.mw-native-mepr .mwn-page *, body.mw-native-mepr .mwn-page *::before, body.mw-native-mepr .mwn-page *::after { box-sizing: border-box; }
@media (min-width: 760px) { body.mw-native-mepr .mwn-page { padding: 8px 28px 56px; } }

/* The card */
body.mw-native-mepr .mwn-card {
  max-width: 520px;
  margin: 16px auto 0;
  padding: 24px 20px;
  background: var(--mwn-surface);
  border-radius: var(--mwn-radius);
  box-shadow: var(--mwn-shadow);
  font-size: 16px;
  line-height: 1.5;
}
body.mw-native-mepr .mwn-checkout .mwn-card { max-width: 720px; }
@media (min-width: 760px) { body.mw-native-mepr .mwn-card { padding: 40px 44px; } }
body.mw-native-mepr .mwn-card .mwn-title { margin: 0 0 20px; padding: 0; font-size: 28px; line-height: 32px; font-weight: 700; color: var(--mwn-ink); text-align: center; }
body.mw-native-mepr .mwn-checkout .mwn-card .mwn-title { text-align: left; }
/* The forgot, reset and expired views carry their own h3 (theme.css strips its weight) */
body.mw-native-mepr .mwn-card .mp_wrapper h3 { margin: 0 0 16px; padding: 0; font-size: 22px; line-height: 1.3; font-weight: 700; color: var(--mwn-ink); text-align: center; }

/* Foodica rules neutralised inside the card (font-size 20px on body/p, 28px paragraph gaps, square bullets, bold links) */
body.mw-native-mepr .mwn-card, body.mw-native-mepr .mwn-card p, body.mw-native-mepr .mwn-card label, body.mw-native-mepr .mwn-card input, body.mw-native-mepr .mwn-card select, body.mw-native-mepr .mwn-card td, body.mw-native-mepr .mwn-card th { font-size: 16px; }
body.mw-native-mepr .mwn-card p { margin: 0 0 16px; line-height: 1.5; }
body.mw-native-mepr .mwn-card ul, body.mw-native-mepr .mwn-card ol { list-style: none; margin: 0; padding: 0; }
body.mw-native-mepr .mwn-card li { list-style: none; margin: 0; padding: 0; }
body.mw-native-mepr .mwn-card a { font-weight: 500; color: var(--mwn-blue); }
body.mw-native-mepr .mwn-card .mp-spacer, body.mw-native-mepr .mwn-card .mepr_spacer { height: 8px; line-height: 8px; }
body.mw-native-mepr .mwn-card .mp_wrapper { margin: 0; }

/* Rows, labels, fields */
body.mw-native-mepr .mwn-card .mp-form-row { margin: 0 0 16px; padding: 0; }
body.mw-native-mepr .mwn-card .mp-form-label { margin: 0 0 6px; }
body.mw-native-mepr .mwn-card .mp-form-label label, body.mw-native-mepr .mwn-card .mp_wrapper label { font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--mwn-ink); margin: 0; }
body.mw-native-mepr .mwn-card .mepr_forgot_password_input input { margin-top: 6px; }
body.mw-native-mepr .mwn-card input[type="text"], body.mw-native-mepr .mwn-card input[type="email"], body.mw-native-mepr .mwn-card input[type="password"], body.mw-native-mepr .mwn-card input[type="tel"], body.mw-native-mepr .mwn-card input[type="url"], body.mw-native-mepr .mwn-card input[type="number"], body.mw-native-mepr .mwn-card select, body.mw-native-mepr .mwn-card input.mepr-form-input, body.mw-native-mepr .mwn-card select.mepr-form-input {
  display: block; width: 100%; min-height: 46px; padding: 10px 14px; margin: 0;
  font-family: inherit; font-size: 16px; line-height: 1.4; color: var(--mwn-ink); background: #fff;
  border: 1px solid var(--mwn-line); border-radius: 10px; box-shadow: none; -webkit-appearance: none; appearance: none;
}
body.mw-native-mepr .mwn-card select, body.mw-native-mepr .mwn-card select.mepr-form-input {
  padding-right: 44px; cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%235f6570' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 16px 16px;
}
body.mw-native-mepr .mwn-card input:focus, body.mw-native-mepr .mwn-card input:focus-visible, body.mw-native-mepr .mwn-card select:focus, body.mw-native-mepr .mwn-card select:focus-visible { outline: none; border: 1px solid var(--mwn-blue); box-shadow: 0 0 0 3px var(--mwn-blue-soft); }
body.mw-native-mepr .mwn-card .mp-hide-pw { position: relative; }
body.mw-native-mepr .mwn-card .mp-hide-pw input { padding-right: 48px; }
body.mw-native-mepr .mwn-card button.mp-hide-pw { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; margin: 0; border: 0; border-radius: 8px; background: transparent; color: var(--mwn-muted); cursor: pointer; box-shadow: none; }
body.mw-native-mepr .mwn-card button.mp-hide-pw:hover, body.mw-native-mepr .mwn-card button.mp-hide-pw:focus-visible { background: var(--mwn-blue-soft); color: var(--mwn-blue); padding: 0; }
body.mw-native-mepr .mwn-card button.mp-hide-pw .dashicons { width: 20px; height: 20px; font-size: 20px; line-height: 20px; position: static; }
body.mw-native-mepr .mwn-card .mepr-visuallyhidden, body.mw-native-mepr .mwn-card .mepr-hidden { display: none; }
/* Remember me (classic markup: <div><label><input id="rememberme"> ...</label></div>) */
body.mw-native-mepr .mwn-card #mepr_loginform label:has(#rememberme) { display: flex; align-items: center; gap: 8px; width: auto; font-size: 14px; font-weight: 500; color: var(--mwn-ink); cursor: pointer; }
body.mw-native-mepr .mwn-card #mepr_loginform #rememberme { width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; display: inline-block; flex: 0 0 auto; accent-color: var(--mwn-blue); cursor: pointer; }
body.mw-native-mepr .mwn-card #mepr_loginform div:has(> label > #rememberme) { margin: 0 0 16px; }

/* Buttons (login.css sets .mp_login_form input[type=submit] at (0,2,1): these selectors are deeper) */
body.mw-native-mepr .mwn-card .submit input[type="submit"], body.mw-native-mepr .mwn-card .mp_login_form input[type="submit"], body.mw-native-mepr .mwn-card input.mepr-submit, body.mw-native-mepr .mwn-card .mwn-button {
  display: block; width: 100%; min-height: 48px; padding: 12px 20px; margin: 0;
  font-family: inherit; font-size: 16px; font-weight: 600; line-height: 1.3; text-align: center; text-decoration: none;
  color: #fff; background: var(--mwn-blue); border: 0; border-radius: 999px; cursor: pointer; box-shadow: none; -webkit-appearance: none; appearance: none;
  transition: background 0.15s ease;
}
body.mw-native-mepr .mwn-card .submit input[type="submit"]:hover, body.mw-native-mepr .mwn-card .mp_login_form input[type="submit"]:hover, body.mw-native-mepr .mwn-card input.mepr-submit:hover, body.mw-native-mepr .mwn-card .mwn-button:hover,
body.mw-native-mepr .mwn-card .submit input[type="submit"]:focus-visible, body.mw-native-mepr .mwn-card .mp_login_form input[type="submit"]:focus-visible, body.mw-native-mepr .mwn-card input.mepr-submit:focus-visible, body.mw-native-mepr .mwn-card .mwn-button:focus-visible { background: var(--mwn-blue-dark); border-color: var(--mwn-blue-dark); color: #fff; outline: none; }
body.mw-native-mepr .mwn-card .mepr-login-actions { margin: 12px 0 0; text-align: center; font-size: 14px; }
body.mw-native-mepr .mwn-card .mepr-login-actions a { font-size: 14px; text-decoration: underline; }
body.mw-native-mepr .mwn-card .mw-login-hint { text-align: center; }
body.mw-native-mepr .mwn-card .mwn-cta { margin: 24px 0 0; padding: 18px 0 0; border-top: 1px solid var(--mwn-line); text-align: center; }
body.mw-native-mepr .mwn-card .mwn-cta p { margin: 0 0 12px; font-size: 14px; color: var(--mwn-muted); }
body.mw-native-mepr .mwn-card .mwn-cta .mwn-button { display: inline-block; width: auto; min-width: 220px; margin: 0 0 12px; }
body.mw-native-mepr .mwn-card .mwn-cta-premium { margin: 0; }
body.mw-native-mepr .mwn-card .mwn-cta-premium a { font-size: 14px; text-decoration: underline; }

/* Errors: the box gets a ground and border (theme.css forces its own with !important); the per-field spans get colour only */
body.mw-native-mepr .mwn-card .mepr_error { color: var(--mwn-red); background-color: var(--mwn-red-soft) !important; border: 1px solid var(--mwn-red) !important; border-radius: 10px; padding: 12px 14px !important; margin: 0 0 16px !important; font-size: 14px; line-height: 1.45; }
body.mw-native-mepr .mwn-card .mepr_error ul { margin: 0 !important; padding: 0 !important; }
body.mw-native-mepr .mwn-card .mepr_error strong { color: var(--mwn-red); }
body.mw-native-mepr .mwn-card .mepr_updated { background-color: #e6f4ea !important; border: 1px solid var(--mwn-green) !important; border-radius: 10px; padding: 12px 14px !important; margin: 0 0 16px !important; font-size: 14px; color: var(--mwn-green); }
body.mw-native-mepr .mwn-card .cc-error, body.mw-native-mepr .mwn-card .mepr-form-has-errors, body.mw-native-mepr .mwn-card .mepr-stripe-card-errors { color: var(--mwn-red); font-size: 13px; }
body.mw-native-mepr .mwn-card .cc-success { color: var(--mwn-green); font-size: 13px; }

/* Checkout */
body.mw-native-mepr .mwn-card .mp-form-row.mepr_price { padding: 12px 16px; margin: 0 0 20px; border-radius: 12px; background: var(--mwn-blue-soft); color: var(--mwn-ink); font-size: 18px; font-weight: 700; line-height: 1.4; }
body.mw-native-mepr .mwn-card .mepr_price .mepr_price_cell_label { margin-right: 6px; font-size: 18px; font-weight: 700; }
body.mw-native-mepr .mwn-card .mepr_price .mepr_price_cell { font-size: 18px; font-weight: 700; }
body.mw-native-mepr .mwn-card .have-coupon-link { display: inline-block; margin: 0 0 12px; font-size: 14px; text-decoration: underline; }
body.mw-native-mepr .mwn-card fieldset.mepr-payment-methods-wrapper { border: 0; padding: 0; margin: 0 0 16px; min-width: 0; }
body.mw-native-mepr .mwn-card fieldset.mepr-payment-methods-wrapper legend { font-size: 14px; font-weight: 600; padding: 0; margin: 0 0 10px; color: var(--mwn-ink); }
body.mw-native-mepr .mwn-card .mepr-payment-methods-icons { margin: 0 0 10px; }
body.mw-native-mepr .mwn-card .mepr-payment-methods-icons img { height: 28px !important; vertical-align: middle; }
body.mw-native-mepr .mwn-card .mepr-payment-methods-radios { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin: 0 0 8px; }
body.mw-native-mepr .mwn-card .mepr-payment-methods-radios label { display: inline-flex !important; align-items: center; gap: 8px; width: auto !important; margin: 0; font-size: 14px; }
body.mw-native-mepr .mwn-card .mepr-payment-methods-radios input[type="radio"] { width: 18px; height: 18px; min-height: 0; margin: 0 !important; accent-color: var(--mwn-blue); cursor: pointer; }
body.mw-native-mepr .mwn-card fieldset.mepr-payment-methods-wrapper hr { border: 0; border-top: 1px solid var(--mwn-line); margin: 12px 0; height: 0; }
/* The app-store gateway (RevenueCat, "Nakko") cannot complete a purchase in a browser, and
   MeprOptionsHelper::payment_methods_radios() gives neither option a visible label. With one
   web gateway left there is nothing to choose, so the chooser goes with it. Remove all four
   selectors the day a second real web gateway is enabled on a product. */
body.mw-native-mepr .mwn-card .mepr-payment-methods-radios label.payment-option-revenuecat,
body.mw-native-mepr .mwn-card .mepr-payment-methods-radios,
body.mw-native-mepr .mwn-card fieldset.mepr-payment-methods-wrapper legend,
body.mw-native-mepr .mwn-card fieldset.mepr-payment-methods-wrapper hr { display: none; }
body.mw-native-mepr .mwn-card .mepr-payment-method { margin: 0; }
body.mw-native-mepr .mwn-card .mepr-stripe-card-element, body.mw-native-mepr .mwn-card .mepr-stripe-payment-element, body.mw-native-mepr .mwn-card .mepr-stripe-elements { margin-top: 12px; }
body.mw-native-mepr .mwn-card .mepr-transaction-invoice-wrapper { padding-top: 0 !important; margin: 0 0 16px; }
body.mw-native-mepr .mwn-card .mp_invoice .mp-table { width: 100% !important; border: 0 !important; border-width: 0 !important; border-collapse: collapse; border-spacing: 0; margin: 0 0 16px; font-size: 14px; }
body.mw-native-mepr .mwn-card .mp_invoice .mp-table th, body.mw-native-mepr .mwn-card .mp_invoice .mp-table td { padding: 10px 6px; border: 0; border-bottom: 1px solid var(--mwn-line); border-width: 0 0 1px 0 !important; border-color: var(--mwn-line); text-align: left; font-size: 14px; text-transform: none; color: var(--mwn-ink); }
body.mw-native-mepr .mwn-card .mp_invoice .mp-table thead th { font-size: 12px; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: var(--mwn-muted); }
body.mw-native-mepr .mwn-card .mp_invoice .mp-table .mp-currency-cell { text-align: right; white-space: nowrap; }
body.mw-native-mepr .mwn-card .mp_invoice .mp-table tfoot th { border-bottom: 0; border-width: 0 !important; font-weight: 700; font-size: 16px; }
body.mw-native-mepr .mwn-card .mp-form-submit { margin: 8px 0 0; }
body.mw-native-mepr .mwn-card .mepr-loading-gif { display: inline-block; vertical-align: middle; margin: 8px 0 0 8px; }
body.mw-native-mepr.mw-native-free .mwn-card .mepr-transaction-invoice-wrapper { display: none; }
body.mw-native-mepr .mwn-card .mepr_math_captcha label { font-size: 14px; }
/* EU VAT rows on the paid products (the VAT add-on prints mepr_vat_customer_type_row, a radios group, then mepr_vat_number_row;
   review M2). theme.css pins the group inline-block (line 255, with .mp_wrapper .mepr-radios-field at width 100% !important
   winning over its own 250px), every row display: block !important, the option labels inline at 222px !important, and the
   group label is a bare <label> under .mp-form-row, inline !important. Here: the group label like the other field labels,
   the options in one wrapping row, 18px radios, the option text at the card's body size and weight. */
body.mw-native-mepr .mwn-card .mepr_vat_customer_type_row > label { display: block !important; width: 100% !important; margin: 0 0 8px; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--mwn-ink); }
body.mw-native-mepr .mwn-card .mepr-radios-field, body.mw-native-mepr .mwn-card .mepr-checkboxes-field { display: flex !important; flex-wrap: wrap; gap: 8px 24px; width: 100% !important; margin: 0 !important; }
body.mw-native-mepr .mwn-card .mepr-radios-field-row, body.mw-native-mepr .mwn-card .mepr-checkboxes-field-row { display: inline-flex !important; align-items: center; gap: 8px; margin: 0 !important; padding: 0 !important; }
body.mw-native-mepr .mwn-card input.mepr-form-radios-input, body.mw-native-mepr .mwn-card input.mepr-form-checkboxes-input { width: 18px; height: 18px; min-height: 0; margin: 0 !important; padding: 0; flex: 0 0 auto; accent-color: var(--mwn-blue); cursor: pointer; }
body.mw-native-mepr .mwn-card .mp_wrapper label.mepr-form-radios-label, body.mw-native-mepr .mwn-card .mp_wrapper label.mepr-form-checkboxes-label { width: auto !important; max-width: none !important; min-width: 0 !important; margin: 0; font-size: 16px; font-weight: 400; line-height: 1.4; color: var(--mwn-ink); cursor: pointer; }

/* Thank-you */
body.mw-native-mepr .mwn-thankyou .mwn-card > p { font-size: 18px; line-height: 1.55; }
body.mw-native-mepr .mwn-thankyou .mwn-card p.mwn-summary { font-size: 16px; line-height: 1.5; color: var(--mwn-muted); text-align: center; }
body.mw-native-mepr .mwn-card .mwn-summary strong { color: var(--mwn-ink); }
body.mw-native-mepr .mwn-thankyou .mwn-card p.mwn-thankyou-cta { margin: 24px 0 0; font-size: 16px; text-align: center; }
body.mw-native-mepr .mwn-card p.mwn-thankyou-cta a.mwn-button { text-decoration: none; font-weight: 600; }
@media (min-width: 480px) { body.mw-native-mepr .mwn-card .mwn-thankyou-cta .mwn-button { display: inline-block; width: auto; min-width: 260px; } }
