/*
 * JMP — OJS Custom Stylesheet
 * Upload via: OJS Admin → Settings → Website → Appearance → Custom Stylesheet
 *
 * Targets OJS 3.3.x / 3.4.x default theme.
 * Font: Nunito Sans from Google Fonts (matches Museo Sans proportions).
 * Once jmp.unihome.com.np is deployed, swap section 1 back to
 * the @font-face declarations pointing to the self-hosted Museo Sans files.
 * Design tokens match assets/css/main.css exactly.
 * ============================================================ */

/* ── 1. Font stack ─────────────────────────────────────────── */
/* No @font-face declarations — use system font stack to avoid any
   external font requests or font-loading delays.
   When jmp.unihome.com.np is live, add Museo Sans @font-face here. */

/* ── 2. Design tokens ──────────────────────────────────────── */
:root {
  --jmp-navy:       #0D2B55;
  --jmp-navy-dark:  #0a2247;
  --jmp-gold:       #C8A84B;
  --jmp-gold-dark:  #A8862E;
  --jmp-cream:      #F8F6F1;
  --jmp-white:      #FFFFFF;
  --jmp-text:       #1A1A2E;
  --jmp-text-mid:   #4B5563;
  --jmp-text-light: #9CA3AF;
  --jmp-teal:       #0E7490;
  --jmp-border:     #E5E7EB;
  --jmp-radius:     6px;
  --jmp-shadow:     0 4px 16px rgba(0,0,0,.10), 0 2px 6px rgba(0,0,0,.07);
}

/* ── 3. Global typography ──────────────────────────────────── */
body,
input, textarea, select, button,
.pkp_site_name a,
.pkp_navigation_primary a,
.pkp_navigation_user a {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

body {
  color: var(--jmp-text);
  background: var(--jmp-white);
  font-size: 16px;
  line-height: 1.65;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 700;
  color: var(--jmp-navy);
  line-height: 1.25;
}

a {
  color: var(--jmp-teal);
  transition: color .2s;
}
a:hover { color: var(--jmp-navy); }

/* ── 4. Header / Navigation ────────────────────────────────── */
/* Confirmed selector: .pkp_site_nav_menu (rgb 30,98,146 default) */
.pkp_site_nav_menu {
  background: var(--jmp-navy) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.2) !important;
}

/* White bar above nav (site name row) */
.pkp_head_wrapper {
  background: var(--jmp-white) !important;
  border-bottom: none !important;
}
.pkp_site_name_wrapper {
  background: var(--jmp-white) !important;
  padding: .6rem 0 !important;
}

/* Journal name */
.pkp_site_name a,
.pkp_site_name h1 {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--jmp-navy) !important;
  text-decoration: none !important;
  letter-spacing: .01em !important;
}
.pkp_site_name a:hover { color: var(--jmp-gold) !important; }

/* Primary nav links — white text on navy bar */
.pkp_navigation_primary a,
.pkp_navigation_primary li a,
.pkp_nav_list > li > a {
  font-size: .85rem !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.8) !important;
  text-decoration: none !important;
  padding: .55rem .85rem !important;
  border-radius: 4px !important;
  transition: color .2s, background .2s !important;
}
.pkp_navigation_primary a:hover,
.pkp_navigation_primary li a:hover {
  color: var(--jmp-white) !important;
  background: rgba(255,255,255,.12) !important;
}
.pkp_navigation_primary .current > a,
.pkp_nav_list > li.current > a {
  color: var(--jmp-gold) !important;
  font-weight: 600 !important;
}

/* Dropdown submenu — white background, dark text
   OJS 3.x uses a plain nested <ul> (no .dropdown-menu class) */
.pkp_navigation_primary li ul,
.pkp_navigation_primary .dropdown-menu,
.pkp_nav_list li ul,
.pkp_site_nav_menu li ul {
  background: var(--jmp-white) !important;
  border: 1px solid var(--jmp-border) !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
  padding: .4rem 0 !important;
  min-width: 200px !important;
}
.pkp_navigation_primary li ul a,
.pkp_navigation_primary li ul li a,
.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list li ul a,
.pkp_site_nav_menu li ul a {
  color: var(--jmp-text) !important;
  font-size: .82rem !important;
  font-weight: 400 !important;
  padding: .5rem 1.1rem !important;
  border-radius: 0 !important;
  display: block !important;
  background: transparent !important;
}
.pkp_navigation_primary li ul a:hover,
.pkp_nav_list li ul a:hover,
.pkp_site_nav_menu li ul a:hover {
  color: var(--jmp-navy) !important;
  background: var(--jmp-cream) !important;
}

/* User nav wrapper — absolutely positioned at very top of page (white bg area),
   needs its own dark background to make white links visible */
.pkp_navigation_user_wrapper {
  background: #0a2240 !important;
  padding: 0 1.5rem !important;
  min-height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: 100% !important;
  box-sizing: border-box !important;
  z-index: 100 !important;
}
/* User nav top-level links (admin username, Login, Register) */
.pkp_navigation_user > ul > li > a,
.pkp_navigation_user_wrapper > ul > li > a {
  font-size: .8rem !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.85) !important;
  text-decoration: none !important;
}
.pkp_navigation_user > ul > li > a:hover,
.pkp_navigation_user_wrapper > ul > li > a:hover {
  color: var(--jmp-gold) !important;
}
/* Register / Login pill */
.pkp_navigation_user .register a,
.pkp_navigation_user li.register a {
  background: var(--jmp-gold) !important;
  color: var(--jmp-navy) !important;
  font-weight: 700 !important;
  padding: .4rem .9rem !important;
  border-radius: var(--jmp-radius) !important;
  text-decoration: none !important;
  transition: background .2s !important;
}
.pkp_navigation_user .register a:hover,
.pkp_navigation_user li.register a:hover {
  background: var(--jmp-gold-dark) !important;
}

/* User nav DROPDOWN (Profile, Dashboard, Logout) — white bg, dark text */
.pkp_navigation_user li ul,
.pkp_navigation_user .dropdown-menu {
  background: var(--jmp-white) !important;
  border: 1px solid var(--jmp-border) !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
  padding: .4rem 0 !important;
  min-width: 180px !important;
}
.pkp_navigation_user li ul a,
.pkp_navigation_user .dropdown-menu a {
  color: var(--jmp-text) !important;
  font-size: .82rem !important;
  font-weight: 400 !important;
  padding: .5rem 1rem !important;
  display: block !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.pkp_navigation_user li ul a:hover,
.pkp_navigation_user .dropdown-menu a:hover {
  color: var(--jmp-navy) !important;
  background: var(--jmp-cream) !important;
}

/* Mobile nav toggle — white on navy */
.pkp_site_nav_toggle,
.pkp_nav_toggle {
  color: var(--jmp-white) !important;
}

/* Breadcrumbs */
.pkp_breadcrumbs a,
.cmp_breadcrumbs a {
  color: var(--jmp-teal) !important;
}
.pkp_breadcrumbs li::before,
.cmp_breadcrumbs li::before {
  color: var(--jmp-text-light) !important;
}

/* ── 5. Buttons ────────────────────────────────────────────── */
.pkpButton,
button.pkpButton,
a.pkpButton,
input[type="submit"],
.btn,
.button {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .88rem !important;
  font-weight: 700 !important;
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
  border: 2px solid var(--jmp-navy) !important;
  border-radius: var(--jmp-radius) !important;
  padding: .65rem 1.4rem !important;
  cursor: pointer !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .35rem !important;
  transition: background .2s, border-color .2s, transform .15s !important;
  line-height: 1.4 !important;
}
.pkpButton:hover,
button.pkpButton:hover,
a.pkpButton:hover,
input[type="submit"]:hover {
  background: var(--jmp-navy-dark) !important;
  border-color: var(--jmp-navy-dark) !important;
  color: var(--jmp-white) !important;
  transform: translateY(-1px) !important;
}

/* Primary/submit button — gold */
.pkpButton--primary,
button[type="submit"].pkpButton,
input[type="submit"].pkpButton,
.submitFormButton,
.pkp_form .pkpButton:last-of-type,
#pkp_content_main .pkpButton.isPrimary {
  background: var(--jmp-gold) !important;
  color: var(--jmp-navy) !important;
  border-color: var(--jmp-gold) !important;
}
.pkpButton--primary:hover,
#pkp_content_main .pkpButton.isPrimary:hover {
  background: var(--jmp-gold-dark) !important;
  border-color: var(--jmp-gold-dark) !important;
  color: var(--jmp-navy) !important;
}

/* Secondary / outlined button */
.pkpButton--secondary,
.pkpButton.isWarnable {
  background: transparent !important;
  color: var(--jmp-navy) !important;
  border-color: var(--jmp-navy) !important;
}
.pkpButton--secondary:hover {
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
}

/* ── 6. Forms ──────────────────────────────────────────────── */
.pkp_form label,
.pkp_form .label,
fieldset legend {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: var(--jmp-text) !important;
  margin-bottom: .35rem !important;
}

.pkp_form input[type="text"],
.pkp_form input[type="email"],
.pkp_form input[type="password"],
.pkp_form input[type="url"],
.pkp_form textarea,
.pkp_form select,
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .88rem !important;
  color: var(--jmp-text) !important;
  border: 1px solid var(--jmp-border) !important;
  border-radius: var(--jmp-radius) !important;
  padding: .6rem .85rem !important;
  transition: border-color .2s, box-shadow .2s !important;
  background: var(--jmp-white) !important;
  width: 100%;
}
.pkp_form input[type="text"]:focus,
.pkp_form input[type="email"]:focus,
.pkp_form input[type="password"]:focus,
.pkp_form textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus {
  outline: none !important;
  border-color: var(--jmp-navy) !important;
  box-shadow: 0 0 0 3px rgba(13,43,85,.12) !important;
}

.pkp_form .description,
.pkp_form .instruct {
  font-size: .8rem !important;
  color: var(--jmp-text-mid) !important;
  margin-top: .25rem !important;
}

/* Fieldset / step panels */
.pkp_form fieldset,
.section {
  border: 1px solid var(--jmp-border) !important;
  border-radius: var(--jmp-radius) !important;
  padding: 1.5rem !important;
  margin-bottom: 1.5rem !important;
  background: var(--jmp-white) !important;
}

/* Notification / alert bars */
.pkp_notification,
.notifySuccess,
.notifyWarning,
.notifyError {
  border-radius: var(--jmp-radius) !important;
  font-size: .85rem !important;
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  padding: .85rem 1.25rem !important;
}
.notifySuccess { background: #f0fdf4 !important; border-left: 3px solid #16a34a !important; color: #166534 !important; }
.notifyWarning { background: #fffbeb !important; border-left: 3px solid var(--jmp-gold) !important; color: #92400e !important; }
.notifyError   { background: #fef2f2 !important; border-left: 3px solid #dc2626 !important; color: #991b1b !important; }

/* ── 7. Submission flow ────────────────────────────────────── */
/* Step indicator */
.pkp_page_submission .steps,
.submission-wizard__steps {
  border-bottom: 1px solid var(--jmp-border) !important;
  margin-bottom: 2rem !important;
  padding-bottom: 1rem !important;
}
.pkp_page_submission .step__label,
.submission-wizard__step-label {
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .8rem !important;
  font-weight: 600 !important;
  color: var(--jmp-text-mid) !important;
}
.pkp_page_submission .step.isActive .step__label,
.submission-wizard__step--current .step__label {
  color: var(--jmp-navy) !important;
}
.pkp_page_submission .step__button--current,
.submission-wizard__step--current .step__button {
  border-color: var(--jmp-gold) !important;
  background: var(--jmp-gold) !important;
  color: var(--jmp-navy) !important;
}

/* Section headers within submission */
.pkp_page_submission h2,
.pkp_page_submission h3 {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--jmp-navy) !important;
  padding-left: .85rem !important;
  border-left: 3px solid var(--jmp-gold) !important;
  margin-bottom: 1rem !important;
}

/* Upload box */
.pkpDropzone,
.fileUploadWizard {
  border: 2px dashed var(--jmp-border) !important;
  border-radius: var(--jmp-radius) !important;
  background: var(--jmp-cream) !important;
  transition: border-color .2s !important;
}
.pkpDropzone:hover { border-color: var(--jmp-gold) !important; }

/* ── 8. Article / Issue pages ──────────────────────────────── */
.obj_article_summary .title a,
.obj_issue_summary .title a,
.article_summary .title a {
  color: var(--jmp-navy) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}
.obj_article_summary .title a:hover,
.obj_issue_summary .title a:hover {
  color: var(--jmp-teal) !important;
}

/* DOI badge */
.pkp_doi_identifier,
.doi {
  font-size: .75rem !important;
  font-family: 'Courier New', monospace !important;
  color: var(--jmp-teal) !important;
  background: rgba(14,116,144,.07) !important;
  padding: .15rem .5rem !important;
  border-radius: 3px !important;
  display: inline-block !important;
}

/* Abstract */
.item.abstract .value,
.article-details .abstract {
  font-size: .95rem !important;
  line-height: 1.75 !important;
  color: var(--jmp-text-mid) !important;
  border-left: 3px solid var(--jmp-gold) !important;
  padding-left: 1rem !important;
  margin-block: 1rem !important;
}

/* PDF / full-text buttons */
.obj_galley_link,
.obj_galley_link.pdf,
a.obj_galley_link {
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
  border: 2px solid var(--jmp-navy) !important;
  border-radius: var(--jmp-radius) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  padding: .45rem 1rem !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .3rem !important;
  transition: background .2s !important;
}
.obj_galley_link:hover { background: var(--jmp-navy-dark) !important; border-color: var(--jmp-navy-dark) !important; }
.obj_galley_link.pdf {
  background: var(--jmp-gold) !important;
  color: var(--jmp-navy) !important;
  border-color: var(--jmp-gold) !important;
}
.obj_galley_link.pdf:hover { background: var(--jmp-gold-dark) !important; border-color: var(--jmp-gold-dark) !important; }

/* Issue table of contents */
.issue .tocTitle h2 {
  font-size: 1.4rem !important;
  color: var(--jmp-navy) !important;
  border-bottom: 2px solid var(--jmp-gold) !important;
  padding-bottom: .5rem !important;
  margin-bottom: 1.5rem !important;
}

/* ── 9. Sidebar ────────────────────────────────────────────── */
.pkp_structure_sidebar .pkp_block {
  border: 1px solid var(--jmp-border) !important;
  border-radius: var(--jmp-radius) !important;
  overflow: hidden !important;
  margin-bottom: 1.5rem !important;
}
.pkp_structure_sidebar .pkp_block .title {
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  padding: .75rem 1rem !important;
  margin: 0 !important;
}
.pkp_structure_sidebar .pkp_block .content {
  padding: .85rem 1rem !important;
  font-size: .85rem !important;
}
.pkp_structure_sidebar a {
  color: var(--jmp-teal) !important;
  text-decoration: none !important;
}
.pkp_structure_sidebar a:hover { color: var(--jmp-navy) !important; }

/* ── 10. Pagination ────────────────────────────────────────── */
.pkp_pages a,
.cmp_pagination a,
ul.pagination a {
  color: var(--jmp-navy) !important;
  border: 1px solid var(--jmp-border) !important;
  border-radius: var(--jmp-radius) !important;
  padding: .35rem .65rem !important;
  font-size: .82rem !important;
  text-decoration: none !important;
  transition: background .2s, color .2s !important;
}
.pkp_pages a:hover,
.cmp_pagination a:hover { background: var(--jmp-cream) !important; }
.pkp_pages .current,
.cmp_pagination .current {
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
  border-color: var(--jmp-navy) !important;
  font-weight: 700 !important;
}

/* ── 11. Footer ────────────────────────────────────────────── */
#pkp_footer,
.pkp_structure_footer {
  background: var(--jmp-navy) !important;
  color: rgba(255,255,255,.65) !important;
  font-size: .82rem !important;
  padding: 2rem 0 !important;
  margin-top: 4rem !important;
}
#pkp_footer a,
.pkp_structure_footer a {
  color: rgba(255,255,255,.65) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}
#pkp_footer a:hover,
.pkp_structure_footer a:hover { color: var(--jmp-white) !important; }

/* OJS/PKP brand image — invert to white on navy background */
.pkp_structure_footer img,
.pkp_brand_footer img {
  filter: brightness(0) invert(1) !important;
  opacity: .55 !important;
}
.pkp_structure_footer img:hover,
.pkp_brand_footer img:hover {
  opacity: .85 !important;
}

/* ── 12. Page background & content area ────────────────────── */
.pkp_structure_content,
#pkp_content_main {
  background: var(--jmp-white) !important;
}
.pkp_page_issue,
.pkp_page_article,
.pkp_page_submission,
.pkp_page_catalog {
  padding-block: 2.5rem !important;
}

/* Page headings */
#pkp_content_main h1.page_title,
.pkp_page_title,
.page_header h1 {
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
  font-weight: 700 !important;
  color: var(--jmp-navy) !important;
  padding-left: .85rem !important;
  border-left: 3px solid var(--jmp-gold) !important;
  margin-bottom: 1.5rem !important;
}

/* ── 13. Table styles ──────────────────────────────────────── */
table {
  border-collapse: collapse !important;
  width: 100% !important;
  font-size: .88rem !important;
}
table th {
  background: var(--jmp-navy) !important;
  color: var(--jmp-white) !important;
  font-weight: 700 !important;
  padding: .65rem 1rem !important;
  text-align: left !important;
  font-size: .75rem !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
}
table td {
  padding: .65rem 1rem !important;
  border-bottom: 1px solid var(--jmp-border) !important;
  color: var(--jmp-text) !important;
}
table tr:hover td { background: var(--jmp-cream) !important; }

/* ── 14. Checklist / checkboxes ────────────────────────────── */
.pkp_form .checkbox label,
.pkp_form .radio label {
  font-size: .88rem !important;
  color: var(--jmp-text) !important;
  cursor: pointer !important;
}
input[type="checkbox"]:checked,
input[type="radio"]:checked {
  accent-color: var(--jmp-navy) !important;
}

/* ── 15. Rich text editor toolbar ──────────────────────────── */
.ql-toolbar {
  border-color: var(--jmp-border) !important;
  border-radius: var(--jmp-radius) var(--jmp-radius) 0 0 !important;
  background: var(--jmp-cream) !important;
}
.ql-container {
  border-color: var(--jmp-border) !important;
  border-radius: 0 0 var(--jmp-radius) var(--jmp-radius) !important;
  font-family: 'Helvetica Neue', Arial, sans-serif !important;
  font-size: .92rem !important;
}