/* =====================================
   Footer
===================================== */
#footer .contact-widget h4 a img {
  width: 300px;
  max-width: 100%;
  height: auto;
}

.footerSupports img[src*="crossref-logo"] {
  display: none;
}


/* =====================================
   Editorial Page Base
===================================== */
.jcmam-editorial-page {
  font-family: "Segoe UI", Arial, sans-serif;
  background: #fff;
  color: #333;
  line-height: 1.6;
  font-size: 18px;
}

.jcmam-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 20px;
  background: #fff;
}

.jcmam-title {
  font-size: 3rem;
  text-align: center;
  margin-bottom: 60px;
  color: #1f6f8b;
  font-weight: 700;
}

/* =====================================
   Chief Editor
===================================== */
.jcmam-chief-editor {
  background: linear-gradient(135deg, #0b3c5d, #1f6f8b);
  color: #ffffff !important;
  padding: 50px 35px;
  border-radius: 14px;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.3);
  text-align: center;
  margin-bottom: 60px;
}

.jcmam-chief-editor h2 {
  font-size: 2.4rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 30px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.6);
  display: inline-block;
  padding-bottom: 12px;
}

.jcmam-chief-editor h3 {
  font-size: 2rem;
  margin-bottom: 18px;
}

.jcmam-chief-editor p {
  font-size: 1.25rem;
  margin: 8px 0;
}

.jcmam-chief-editor a {
  color: #ffeb99;
  font-weight: 600;
  text-decoration: none;
}

.jcmam-chief-editor a:hover {
  text-decoration: underline;
}

.jcmam-chief-editor,
.jcmam-chief-editor h2,
.jcmam-chief-editor h3,
.jcmam-chief-editor p,
.jcmam-chief-editor strong,
.jcmam-chief-editor a {
  color: #ffffff !important;
}

/* Optional: slightly brighter email link */
.jcmam-chief-editor a {
  color: #ffeb99 !important;
  font-weight: 600;
}

/* Optional: improve separator visibility */
.jcmam-chief-editor h2 {
  border-bottom: 2px solid rgba(255, 255, 255, 0.6);
}


/* =====================================
   Editorial Board
===================================== */
.jcmam-editorial-board h2 {
  text-align: center;
  font-size: 2.4rem;
  margin-bottom: 35px;
  color: #0b3c5d;
}

.jcmam-editor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 35px;
}

.jcmam-editor-card {
  background: #fff;
  padding: 35px 30px;
  border-radius: 14px;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  font-size: 1.2rem;
}

.jcmam-editor-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}

.jcmam-editor-card h3 {
  color: #1f6f8b;
  font-size: 1.7rem;
  margin-bottom: 14px;
}

.jcmam-editor-card p,
.jcmam-editor-card a {
  font-size: 1.15rem;
  line-height: 1.8;
}

.jcmam-editor-card a {
  color: #0b3c5d;
  font-weight: 600;
  text-decoration: none;
}

.jcmam-editor-card a:hover {
  text-decoration: underline;
}

.jcmam-footer {
  text-align: center;
  margin-top: 60px;
  font-size: 0.9rem;
  color: #777;
}


/* =====================================
   CFP Widget
===================================== */
.cfp-mini {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  background: #f8fafc;
  border: 1px solid #dfe5f1;
  border-radius: 8px;
  padding: 20px;
  max-width: 320px;
}

.cfp-mini h3 {
  margin: 0 0 12px;
  font-size: 18px;
  color: #2f3a5f;
  border-bottom: 1px solid #e1e6f0;
  padding-bottom: 8px;
}

.cfp-mini p {
  margin-bottom: 14px;
  line-height: 1.55;
}

.cfp-dates {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
}

.cfp-dates li {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 13.5px;
}

.cfp-dates .label { color: #555; }
.cfp-dates .date  { font-weight: 600; }

.cfp-button {
  display: block;
  width: 100%;
  text-align: center;
  background: #3c4567;
  color: #fff;
  padding: 12px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.cfp-button:hover,
.cfp-button:focus {
  background: #2f3754;
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.15);
}

.cfp-button:hover,
.cfp-button:focus {
    background: #2f3754;   /* darker shade */
    color: #ffffff;        /* FORCE text color */
    text-decoration: none; /* prevent underline */
}


/* =====================================
   Login Page — Complete Reset
===================================== */

ul#openid-provider-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 460px !important;
  width: 100% !important;
}

/* Single card wrapping everything */
ul#openid-provider-list {
  background: #fff !important;
  border: 1px solid #dde3ee !important;
  border-radius: 10px !important;
  padding: 36px 40px !important;
}

/* Hide "Sign in with your account at..." — redundant with h1 */
ul#openid-provider-list > li.margin-top-30:first-child {
  display: none !important;
}

/* Remove inner card on the form li */
ul#openid-provider-list li.page_login {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

ul#openid-provider-list li.page_login form,
ul#openid-provider-list li.page_login fieldset {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Field wrappers */
ul#openid-provider-list .username,
ul#openid-provider-list .password {
  margin-bottom: 18px !important;
  width: 100% !important;
}

ul#openid-provider-list .remember {
  margin-bottom: 22px !important;
}

/* Labels — restore visibility */
ul#openid-provider-list .username .label,
ul#openid-provider-list .password .label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #222 !important;
  margin-bottom: 6px !important;
}

ul#openid-provider-list .required {
  color: #c0392b !important;
  margin-left: 2px !important;
}

ul#openid-provider-list .pkp_screen_reader {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Inputs */
ul#openid-provider-list input[type="text"],
ul#openid-provider-list input[type="password"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 12px !important;
  border: 1px solid #c8d0e0 !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  color: #222 !important;
  background: #fff !important;
  outline: none !important;
  margin: 0 !important;
  -webkit-appearance: none !important;
}

ul#openid-provider-list input[type="text"]:focus,
ul#openid-provider-list input[type="password"]:focus {
  border-color: #1f6f8b !important;
  box-shadow: 0 0 0 3px rgba(31,111,139,0.12) !important;
}

/* Forgot password */
ul#openid-provider-list .password a {
  display: inline-block !important;
  margin-top: 7px !important;
  font-size: 13px !important;
  color: #1f6f8b !important;
  text-decoration: none !important;
}

ul#openid-provider-list .password a:hover {
  text-decoration: underline !important;
}

/* Remember me */
ul#openid-provider-list .remember label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
}

ul#openid-provider-list .remember input[type="checkbox"] {
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

ul#openid-provider-list .remember .label {
  display: inline !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #444 !important;
  margin: 0 !important;
}

/* Login button */
ul#openid-provider-list .buttons button,
ul#openid-provider-list button.submit,
ul#openid-provider-list input[type="submit"] {
  display: block !important;
  width: 100% !important;
  padding: 11px 0 !important;
  background: #0b3c5d !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  text-align: center !important;
  -webkit-appearance: none !important;
  transition: background .2s;
}

ul#openid-provider-list .buttons button:hover,
ul#openid-provider-list button.submit:hover {
  background: #1f6f8b !important;
}

/* Divider before OAuth */
ul#openid-provider-list > li.margin-top-30:last-of-type {
  margin-top: 24px !important;
  padding-top: 22px !important;
  border-top: 1px solid #e0e6ef !important;
  margin-bottom: 0 !important;
}

ul#openid-provider-list > li.margin-top-30:last-of-type strong {
  display: block !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #999 !important;
  font-weight: 400 !important;
  margin-bottom: 14px !important;
}

/* OAuth buttons — NO display:contents */
ul#openid-provider-list li a[id^="openid-provider"] {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 16px !important;
  margin-bottom: 10px !important;
  border: 1px solid #c8d0e0 !important;
  border-radius: 6px !important;
  background: #fff !important;
  text-decoration: none !important;
  color: #222 !important;
  transition: background .15s, border-color .15s;
}

ul#openid-provider-list li a[id^="openid-provider"]:hover {
  background: #f0f5fa !important;
  border-color: #1f6f8b !important;
}

/* The div inside the <a> — keep as flex row, just no background */
ul#openid-provider-list li a[id^="openid-provider"] div {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  width: 100% !important;
  box-shadow: none !important;
}

ul#openid-provider-list li a[id^="openid-provider"] img {
  width: 22px !important;
  height: 22px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}

ul#openid-provider-list li a[id^="openid-provider"] span {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #222 !important;
}

ul#openid-provider-list li a[id^="openid-provider"]:hover span {
  color: #0b3c5d !important;
}

/* Force left alignment on everything inside the form */
ul#openid-provider-list li.page_login,
ul#openid-provider-list li.page_login form,
ul#openid-provider-list li.page_login fieldset,
ul#openid-provider-list li.page_login .fields,
ul#openid-provider-list .username,
ul#openid-provider-list .password,
ul#openid-provider-list .remember,
ul#openid-provider-list .buttons {
  text-align: left !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
}

/* Labels left-aligned */
ul#openid-provider-list .username .label,
ul#openid-provider-list .password .label {
  text-align: left !important;
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #222 !important;
  margin-bottom: 6px !important;
}

/* Inputs full width, left-aligned */
ul#openid-provider-list input[type="text"],
ul#openid-provider-list input[type="password"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  text-align: left !important;
  margin: 0 auto !important;
  margin-left: 0 !important;
  float: none !important;
  padding: 9px 12px !important;
  border: 1px solid #c8d0e0 !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  color: #222 !important;
  background: #fff !important;
}

/* Fix checkbox+label — the label wraps both,
   so we target the label element directly */
ul#openid-provider-list .remember,
ul#openid-provider-list .remember label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  text-align: left !important;
  width: 100% !important;
}

ul#openid-provider-list .remember input[type="checkbox"] {
  display: inline-block !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  flex-shrink: 0 !important;
  position: static !important;
}

ul#openid-provider-list .remember .label {
  display: inline !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #444 !important;
  margin: 0 !important;
  text-align: left !important;
}

/* OAuth section also left-aligned */
ul#openid-provider-list > li.margin-top-30:last-of-type,
ul#openid-provider-list li a[id^="openid-provider"],
ul#openid-provider-list li a[id^="openid-provider"] div {
  text-align: left !important;
}


/* =====================================
   OAuth Complete Registration Page
===================================== */

.page_openid_login form#oauth,
form#oauth {
  max-width: 520px !important;
  width: 100% !important;
}

/* Choice links (Yes / No) */
ul#openid-choice-select {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 28px 0 !important;
}

ul#openid-choice-select li {
  margin-bottom: 10px !important;
}

.step2-choice-links {
  display: inline-block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #1f6f8b !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  padding: 0 !important;
}

.step2-choice-links:hover {
  color: #0b3c5d !important;
}

/* Shared card style for both login and register forms */
#login-form,
#register-form {
  background: #fff !important;
  border: 1px solid #dde3ee !important;
  border-radius: 10px !important;
  padding: 32px 36px !important;
  margin-top: 8px !important;
}

/* Fieldset reset */
#login-form fieldset,
#register-form fieldset {
  border: none !important;
  padding: 0 !important;
  margin: 0 0 20px 0 !important;
}

/* Warning notification */
#login-form .cmp_notification.warning,
#register-form .cmp_notification.warning {
  background: #fff8e1 !important;
  border-left: 3px solid #f0a500 !important;
  border-radius: 0 6px 6px 0 !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  color: #5a4000 !important;
  margin-bottom: 22px !important;
}

/* Field wrappers */
#login-form .username,
#login-form .password,
#register-form .given_name,
#register-form .family_name,
#register-form .email,
#register-form .username,
#register-form .affiliation,
#register-form .country,
#register-form .reviewer_interests {
  margin-bottom: 18px !important;
  width: 100% !important;
  text-align: left !important;
}

/* Labels */
#login-form .label,
#register-form .label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #222 !important;
  margin-bottom: 6px !important;
  text-align: left !important;
}

#login-form .required,
#register-form .required {
  color: #c0392b !important;
  margin-left: 2px !important;
}

#login-form .pkp_screen_reader,
#register-form .pkp_screen_reader {
  position: absolute !important;
  left: -9999px !important;
}

/* All text/email/password inputs */
#login-form input[type="text"],
#login-form input[type="password"],
#login-form input[type="email"],
#register-form input[type="text"],
#register-form input[type="password"],
#register-form input[type="email"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 12px !important;
  border: 1px solid #c8d0e0 !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  color: #222 !important;
  background: #fff !important;
  text-align: left !important;
  margin: 0 !important;
  outline: none !important;
}

#login-form input[type="text"]:focus,
#login-form input[type="password"]:focus,
#register-form input[type="text"]:focus,
#register-form input[type="email"]:focus {
  border-color: #1f6f8b !important;
  box-shadow: 0 0 0 3px rgba(31,111,139,0.12) !important;
}

/* Country select */
#register-form select {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 12px !important;
  border: 1px solid #c8d0e0 !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  color: #222 !important;
  background: #fff !important;
  outline: none !important;
}

#register-form select:focus {
  border-color: #1f6f8b !important;
  box-shadow: 0 0 0 3px rgba(31,111,139,0.12) !important;
}

/* Forgot password */
#login-form .password a {
  display: inline-block !important;
  margin-top: 7px !important;
  font-size: 13px !important;
  color: #1f6f8b !important;
  text-decoration: none !important;
}

#login-form .password a:hover {
  text-decoration: underline !important;
}

/* Consent checkboxes */
#register-form .optin label,
#register-form .optin-privacy label,
#register-form .optin-email label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 13px !important;
  color: #444 !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  margin-bottom: 14px !important;
}

#register-form .optin input[type="checkbox"] {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  margin: 2px 0 0 0 !important;
  flex-shrink: 0 !important;
}

/* Buttons */
#login-form .buttons,
#register-form .buttons {
  margin-top: 8px !important;
}

#login-form .buttons button,
#register-form .buttons button {
  display: block !important;
  width: 100% !important;
  padding: 11px 0 !important;
  background: #0b3c5d !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  text-align: center !important;
  transition: background .2s;
}

#login-form .buttons button:hover,
#register-form .buttons button:hover {
  background: #1f6f8b !important;
}



/* Animation */
.cfp-animate {
  animation: cfpPop 0.6s ease-out both;
}

@keyframes cfpPop {
  from {
    opacity: 0;
    transform: translateY(15px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}