/* =========================================================
   JPMHR GLOBAL UI POLISH (Safe for OJS)
   Brand: Teal #0097B2 | Ink #373643
   Scope: low-risk selectors only (no structural overrides)
   ========================================================= */

:root{
  --jpmhr-teal:#0097B2;
  --jpmhr-teal-dark:#007A90;
  --jpmhr-ink:#373643;
  --jpmhr-muted:#6b6a77;
  --jpmhr-border:#e6e8ef;
  --jpmhr-surface:#ffffff;
  --jpmhr-surface2:#f7f9fc;

  --jpmhr-shadow1:0 1px 2px rgba(0,0,0,.06);
  --jpmhr-shadow2:0 8px 22px rgba(17,24,39,.10);
  --jpmhr-shadow3:0 16px 36px rgba(17,24,39,.14);

  --jpmhr-radius:14px;
  --jpmhr-pill:999px;
}

/* ---------------------------------------------------------
   TYPOGRAPHY & READING COMFORT
--------------------------------------------------------- */

.pkp_structure_main,
.pkp_structure_content,
.pkp_structure_footer{
  color: var(--jpmhr-ink);
}

.pkp_structure_main p{
  line-height: 1.75;
  color: var(--jpmhr-ink);
}

/* ---------------------------------------------------------
   GLOBAL LINK POLISH (Professional, not default-blue)
--------------------------------------------------------- */

.pkp_structure_main a,
.pkp_structure_footer a{
  color: var(--jpmhr-teal);
  text-decoration: none;
  font-weight: 600;
  transition: all .15s ease;
}

.pkp_structure_main a:hover,
.pkp_structure_footer a:hover{
  color: var(--jpmhr-teal-dark);
  text-decoration: none;
}

/* ---------------------------------------------------------
   CONTENT LINKS → SOFT BUTTON STYLE
   (Applies to article-page links, policy links, etc.)
   Excludes navigation & buttons to avoid breaking layout
--------------------------------------------------------- */

.pkp_structure_main .page a:not(.pkp_button):not(.block_make_submission_link):not(.title a){
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 14px;
  margin: 6px 6px 6px 0;

  background: var(--jpmhr-surface);
  border: 1px solid var(--jpmhr-border);
  border-radius: var(--jpmhr-pill);

  box-shadow: var(--jpmhr-shadow1);

  font-weight: 700;
}

.pkp_structure_main .page a:not(.pkp_button):not(.block_make_submission_link):not(.title a)::after{
  content: "→";
  font-weight: 900;
  color: var(--jpmhr-teal);
}

.pkp_structure_main .page a:not(.pkp_button):not(.block_make_submission_link):not(.title a):hover{
  background: rgba(0,151,178,.06);
  border-color: rgba(0,151,178,.35);
  box-shadow: var(--jpmhr-shadow2);
  transform: translateY(-1px);
}

/* ---------------------------------------------------------
   BUTTONS (OJS native buttons untouched structurally)
--------------------------------------------------------- */

.pkp_structure_main a.pkp_button,
.pkp_structure_main button.pkp_button,
.pkp_structure_main input.pkp_button{
  border-radius: var(--jpmhr-pill);
}

/* ---------------------------------------------------------
   CARD UI (Issue, Article summaries, Sidebar, Footer)
--------------------------------------------------------- */

.pkp_structure_main .obj_issue_toc,
.pkp_structure_main .obj_article_summary,
.pkp_structure_main .obj_issue_summary,
.pkp_structure_sidebar .pkp_block,
.pkp_structure_footer .pkp_block,
.pkp_structure_footer .pkp_footer_content,
.pkp_structure_footer .pkp_brand_footer{
  background: var(--jpmhr-surface);
  border: 1px solid var(--jpmhr-border);
  border-radius: var(--jpmhr-radius);
  box-shadow: var(--jpmhr-shadow1);
}

/* Breathing room */
.pkp_structure_sidebar .pkp_block,
.pkp_structure_footer .pkp_block{
  padding: 16px 18px;
}

/* ---------------------------------------------------------
   HEADINGS
--------------------------------------------------------- */

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3{
  color: var(--jpmhr-ink);
  letter-spacing: .2px;
}

/* ---------------------------------------------------------
   ARTICLE TITLE LINKS (keep elegant, not button style)
--------------------------------------------------------- */

.pkp_structure_main .obj_article_summary .title a,
.pkp_structure_main .obj_issue_toc .title a{
  color: var(--jpmhr-ink);
  font-weight: 800;
  display: inline;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
}

.pkp_structure_main .obj_article_summary .title a:hover,
.pkp_structure_main .obj_issue_toc .title a:hover{
  color: var(--jpmhr-teal-dark);
}

/* ---------------------------------------------------------
   “View All Issues” Button
--------------------------------------------------------- */

.pkp_structure_main a[href*="/issue/archive"]{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 10px 16px;
  border-radius: var(--jpmhr-pill);

  background: rgba(0,151,178,.10);
  border: 1px solid rgba(0,151,178,.25);

  font-weight: 800;
}

.pkp_structure_main a[href*="/issue/archive"]:hover{
  background: rgba(0,151,178,.16);
  border-color: rgba(0,151,178,.45);
  box-shadow: var(--jpmhr-shadow2);
}

/* ---------------------------------------------------------
   FOOTER POLISH
--------------------------------------------------------- */

.pkp_structure_footer .pkp_footer_content,
.pkp_structure_footer .pkp_brand_footer{
  padding: 18px 20px;
  border-left: 4px solid rgba(0,151,178,.55);
}

.pkp_structure_footer strong{
  color: var(--jpmhr-ink);
}

/* =========================================================
   JPMHR About Page — FIX for Journal Identity clutter/overlap
   Paste at VERY BOTTOM of your stylesheet
   ========================================================= */

/* 1) Ensure the definition-list grid can shrink without overflow */
.jpmhr-about-wrap .jpmhr-dl{
  grid-template-columns: 160px minmax(0, 1fr) !important; /* critical: minmax(0,1fr) */
  align-items: start;
}

/* 2) Allow values to wrap (long URLs/emails were forcing overflow) */
.jpmhr-about-wrap .jpmhr-dl dd{
  min-width: 0;                 /* critical for grid overflow */
  overflow-wrap: anywhere;      /* wraps long URLs safely */
  word-break: break-word;
}

/* 3) Reduce clutter: DO NOT style identity/contact links as pill buttons */
.jpmhr-about-wrap .jpmhr-card .jpmhr-dl dd a{
  display: inline !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: var(--teal) !important;
  text-decoration: none !important;
  font-weight: 800;
}

/* Subtle, clean hover (not button-like) */
.jpmhr-about-wrap .jpmhr-card .jpmhr-dl dd a:hover{
  color: var(--tealDark) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* 4) Improve spacing consistency inside the DL */
.jpmhr-about-wrap .jpmhr-dl dt{
  white-space: normal;
  padding-right: 6px;
}

/* 5) Mobile: stack labels/values to avoid any crowding */
@media (max-width: 520px){
  .jpmhr-about-wrap .jpmhr-dl{
    grid-template-columns: 1fr !important;
  }
}