/* ─── In-page auth forms [ak_login_form] [ak_register_form] ─────────────── */

.ak-auth-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 70vh;
  padding: 40px 20px;
}

.ak-auth-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl, var(--radius-lg));
  padding: 40px 44px;
  width: 100%;
  max-width: 420px;
  box-shadow: var(--shadow-md);
}

.ak-auth-logo {
  text-align: center;
  margin-bottom: 28px;
}

.ak-auth-logo h1 {
  font-size: 1.4rem;
  font-weight: 800;
  margin: 12px 0 4px;
  color: var(--c-text);
}

.ak-auth-logo p {
  font-size: 14px;
  color: var(--c-text-2);
}

/* ── Social buttons ── */
.ak-social-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  color: var(--c-text-3);
  font-weight: 500;
  margin: 20px 0;
}

.ak-social-divider::before,
.ak-social-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--c-border);
}

.ak-social-btns {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ak-social-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 16px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  transition: background .15s, border-color .15s;
  text-decoration: none;
  border: 1.5px solid var(--c-border);
  color: var(--c-text);
  background: var(--c-surface2);
}

.ak-social-btn:hover { background: var(--c-border); text-decoration: none; }

.ak-google-btn { color: #3c4043; }
.ak-google-btn:hover { background: #f8f9fa; border-color: #dadce0; color: #3c4043; }

.ak-x-btn { color: var(--c-text); }
.ak-x-btn:hover { background: var(--c-surface2); color: var(--c-text); }

html.dark-mode .ak-google-btn { background: var(--c-surface2); border-color: var(--c-border); color: #e0e0e0; }
html.dark-mode .ak-google-btn:hover { background: var(--c-surface); }

/* ── WP login form fields override (in-page) ── */
.ak-auth-card #loginform,
.ak-auth-card #registerform {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.ak-auth-card #loginform .input,
.ak-auth-card input[type="text"],
.ak-auth-card input[type="email"],
.ak-auth-card input[type="password"],
.ak-auth-card textarea,
.ak-auth-card .ak-input {
  width: 100% !important;
  background: var(--c-surface2) !important;
  border: 1.5px solid var(--c-border) !important;
  border-radius: var(--radius-sm) !important;
  height: 46px !important;
  padding: 0 14px !important;
  font-size: 15px !important;
  font-family: var(--font) !important;
  color: var(--c-text) !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color .15s, box-shadow .15s !important;
  margin-bottom: 4px !important;
}

.ak-auth-card input:focus, .ak-auth-card textarea:focus {
  border-color: var(--c-accent) !important;
  box-shadow: 0 0 0 3px var(--c-accent-ring) !important;
}

.ak-auth-card label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--c-text-2) !important;
  margin-bottom: 5px !important;
}

.ak-auth-card .button-primary,
.ak-auth-card .ak-btn-submit {
  width: 100% !important;
  background: var(--c-primary, var(--c-accent)) !important;
  border: none !important;
  border-radius: var(--r-md, var(--radius-sm)) !important;
  height: 46px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  font-family: var(--font) !important;
  color: #fff !important;
  cursor: pointer !important;
  text-shadow: none !important;
  box-shadow: var(--btn-shadow, 0 2px 10px rgba(var(--c-accent-rgb),.25)) !important;
  transition: background .15s !important;
  margin-top: 8px !important;
}

.ak-auth-card .button-primary:hover,
.ak-auth-card .ak-btn-submit:hover {
  background: var(--c-primary-h, var(--c-accent-h)) !important;
}

.ak-auth-footer {
  text-align: center;
  font-size: 13px;
  color: var(--c-text-2);
  margin-top: 20px !important;
}

.ak-auth-footer a {
  color: var(--c-accent);
  font-weight: 600;
}

/* ── NSL (Nextend Social Login) override ── */
#ak-nsl-wrap .nsl-container { gap: 10px !important; }
#ak-nsl-wrap .nsl-button {
  border-radius: var(--radius-sm) !important;
  border: 1.5px solid var(--c-border) !important;
  height: 44px !important;
  font-family: var(--font) !important;
  font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   PAID MEMBERSHIPS PRO — full color override
   Targets: checkout, account, login, register, invoice, levels pages
═══════════════════════════════════════════════════════════════════════════ */

/* ── Wrappers & boxes ── */
#pmpro_form,
#pmpro_checkout_box,
.pmpro_checkout,
.pmpro_account,
.pmpro_invoice,
.pmpro_levels_page,
.pmpro_member_profile_fields,
#pmpro_levels_table {
  font-family: var(--font) !important;
  color: var(--c-text) !important;
}

/* ── All text inputs inside PMPro ── */
#pmpro_form input[type="text"],
#pmpro_form input[type="email"],
#pmpro_form input[type="password"],
#pmpro_form input[type="tel"],
#pmpro_form input[type="number"],
#pmpro_form select,
#pmpro_form textarea,
.pmpro_checkout input[type="text"],
.pmpro_checkout input[type="email"],
.pmpro_checkout input[type="password"],
.pmpro_checkout input[type="tel"],
.pmpro_checkout input[type="number"],
.pmpro_checkout select,
.pmpro_account input[type="text"],
.pmpro_account input[type="email"],
.pmpro_account input[type="password"],
.pmpro_account select {
  background: var(--c-surface2) !important;
  border: 1.5px solid var(--c-border) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--c-text) !important;
  font-family: var(--font) !important;
  font-size: 15px !important;
  height: 46px !important;
  padding: 0 14px !important;
  box-shadow: none !important;
  outline: none !important;
  width: 100% !important;
  transition: border-color .15s, box-shadow .15s !important;
}

#pmpro_form input:focus,
#pmpro_form select:focus,
#pmpro_form textarea:focus,
.pmpro_checkout input:focus,
.pmpro_checkout select:focus,
.pmpro_account input:focus,
.pmpro_account select:focus {
  border-color: var(--c-accent) !important;
  box-shadow: 0 0 0 3px var(--c-accent-ring) !important;
  background: var(--c-surface) !important;
}

/* ── Labels ── */
#pmpro_form label,
.pmpro_checkout label,
.pmpro_account label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--c-text-2) !important;
  font-family: var(--font) !important;
}

/* ── Primary / submit buttons ── */
#pmpro_form .pmpro_btn,
#pmpro_form .pmpro_btn-submit,
#pmpro_form .pmpro_btn-submit-checkout,
#pmpro_submit_span .pmpro_btn,
.pmpro_btn-submit,
.pmpro_btn-submit-checkout,
input.pmpro_btn,
a.pmpro_btn,
button.pmpro_btn {
  background: var(--c-accent) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  color: #fff !important;
  font-family: var(--font) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  height: 46px !important;
  padding: 0 24px !important;
  cursor: pointer !important;
  text-shadow: none !important;
  box-shadow: 0 2px 10px rgba(var(--c-accent-rgb),.25) !important;
  transition: background .15s !important;
  text-decoration: none !important;
}

#pmpro_form .pmpro_btn:hover,
#pmpro_form .pmpro_btn-submit:hover,
.pmpro_btn-submit:hover,
.pmpro_btn-submit-checkout:hover,
input.pmpro_btn:hover,
a.pmpro_btn:hover,
button.pmpro_btn:hover {
  background: var(--c-accent-h) !important;
  color: #fff !important;
}

/* Secondary / cancel buttons */
.pmpro_btn-cancel,
a.pmpro_btn-cancel {
  background: var(--c-surface2) !important;
  border: 1.5px solid var(--c-border) !important;
  color: var(--c-text-2) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.pmpro_btn-cancel:hover,
a.pmpro_btn-cancel:hover {
  background: var(--c-border) !important;
  color: var(--c-text) !important;
}

/* ── Section headings & dividers ── */
.pmpro_checkout h3,
.pmpro_account h3,
#pmpro_form .pmpro_checkout-field-heading,
.pmpro_checkout-fields > h3 {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--c-text) !important;
  border-bottom: 1px solid var(--c-border) !important;
  padding-bottom: 8px !important;
  margin-bottom: 16px !important;
  font-family: var(--font) !important;
  background: none !important;
}

/* ── Price / level cost ── */
#pmpro_level_cost,
.pmpro_level_cost,
.pmpro_price_display,
.pmpro_checkout-fields .pmpro_level_cost {
  color: var(--c-accent) !important;
  font-weight: 700 !important;
  font-family: var(--font) !important;
}

/* ── Levels table ── */
#pmpro_levels_table th {
  background: var(--c-surface2) !important;
  color: var(--c-text) !important;
  border-color: var(--c-border) !important;
  font-family: var(--font) !important;
}

#pmpro_levels_table td {
  border-color: var(--c-border) !important;
  color: var(--c-text-2) !important;
  font-family: var(--font) !important;
}

#pmpro_levels_table tr:hover td {
  background: var(--c-surface2) !important;
}

/* ── Messages / notices ── */
.pmpro_message,
.pmpro_error,
.pmpro_alert,
.pmpro-alert,
.pmpro_content_message,
div.pmpro_message {
  border-radius: var(--radius-sm) !important;
  font-family: var(--font) !important;
  font-size: 14px !important;
  border-left: 3px solid var(--c-accent) !important;
  background: var(--c-surface2) !important;
  color: var(--c-text) !important;
  border-top: 1px solid var(--c-border) !important;
  border-right: 1px solid var(--c-border) !important;
  border-bottom: 1px solid var(--c-border) !important;
  padding: 12px 16px !important;
  box-shadow: none !important;
}

div.pmpro_error,
.pmpro-alert-danger {
  border-left-color: var(--c-danger) !important;
}

/* ── Links ── */
#pmpro_form a,
.pmpro_checkout a,
.pmpro_account a {
  color: var(--c-accent) !important;
}

#pmpro_form a:hover,
.pmpro_checkout a:hover,
.pmpro_account a:hover {
  color: var(--c-accent-h) !important;
}

/* ── Checkbox (terms of service etc.) ── */
#pmpro_form input[type="checkbox"],
#pmpro_form input[type="radio"] {
  accent-color: var(--c-accent) !important;
  width: auto !important;
  height: auto !important;
}

/* ── PMPro account page main heading ── */
.pmpro_section_title.pmpro_font-x-large { display: none !important; }

/* ── Card/payment fields (Stripe inline) ── */
.pmpro_checkout .StripeElement,
#pmpro_form .StripeElement {
  background: var(--c-surface2) !important;
  border: 1.5px solid var(--c-border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 13px 14px !important;
  transition: border-color .15s, box-shadow .15s !important;
}

.pmpro_checkout .StripeElement--focus,
#pmpro_form .StripeElement--focus {
  border-color: var(--c-accent) !important;
  box-shadow: 0 0 0 3px var(--c-accent-ring) !important;
}

@media (max-width: 480px) {
  .ak-auth-card { padding: 28px 22px; }
}