/* ==========================================================================
   Resincen journal portal (ejournal.resincen.org) — site stylesheet
   OJS 3.5 + theme "Resincen Manuscript": loaded automatically on site-level pages (no upload needed).
   Identity: navy #14284b / #0b1a33 and gold #c9a227 (text gold #8a6a12).
   This file loads only on site-level pages, never inside a journal.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,500&display=swap");

/* ---------- Portal header accents ---------- */
.pkp_structure_head { border-top: 4px solid #c9a227; background: linear-gradient(120deg, #0b1a33, #14284b) !important; }
.pkp_structure_head .pkp_site_name_wrapper,
.pkp_structure_head .pkp_navigation_primary_row,
.pkp_structure_head .pkp_navigation_user_wrapper { background: transparent !important; }
.pkp_structure_head .pkp_site_name .is_text { color: #ffffff; }
.pkp_structure_head .pkp_navigation_user a,
.pkp_structure_head .pkp_navigation_primary > li > a { color: #ffffff; }
.pkp_structure_head .pkp_navigation_user a:hover,
.pkp_structure_head .pkp_navigation_primary > li > a:hover { color: #c9a227; }

/* The theme draws thin column dividers for a sidebar layout; the portal has no sidebar */
.pkp_structure_main::before,
.pkp_structure_main::after { display: none !important; }

/* Footer area around the dark footer card */
.pkp_structure_footer_wrapper { background: #f4f6fa; border-top: 1px solid #e5e7eb; }

/* Wider main column on the portal when the site has no sidebar (recommended) */
@media (min-width: 992px) {
  .pkp_structure_main:first-child:last-child { width: auto; max-width: 1100px; padding-left: 30px; padding-right: 30px; }
}

/* ---------- Per-journal colours (from each cover) ---------- */
.rjp-card { --j-deep: #0b1a33; --j-primary: #14284b; --j-accent: #c9a227; --j-text: #8a6a12; --j-glow: #c9a227; }
.rjp-card[data-journal="iris"] { --j-deep: #172554; --j-primary: #1e3a8a; --j-accent: #0f766e; --j-text: #0f766e; --j-glow: #14b8a6; }
.rjp-card[data-journal="cybia"] { --j-deep: #0a1033; --j-primary: #1e3a8a; --j-accent: #4f46e5; --j-text: #4338ca; --j-glow: #7c6cf2; }
.rjp-card[data-journal="quanta"] { --j-deep: #140a26; --j-primary: #581c87; --j-accent: #a21caf; --j-text: #86198f; --j-glow: #c026d3; }
.rjp-card[data-journal="dimensia"] { --j-deep: #1c1917; --j-primary: #292524; --j-accent: #d97706; --j-text: #b45309; --j-glow: #f59e0b; }
.rjp-card[data-journal="lumina"] { --j-deep: #1a1a1c; --j-primary: #27272a; --j-accent: #ca8a04; --j-text: #a16207; --j-glow: #eab308; }
.rjp-card[data-journal="sein"] { --j-deep: #061726; --j-primary: #0c4a6e; --j-accent: #0284c7; --j-text: #0369a1; --j-glow: #38bdf8; }

/* ---------- Layout ---------- */
.rjp { font-family: Inter,'Segoe UI',Roboto,Arial,sans-serif; color: #1f2328; }
.rjp-about-top { margin: 0 0 8px; }
.rjp-about-bottom { margin: 40px 0 0; }
.rjp-journals { margin: 34px 0 0; scroll-margin-top: 20px; }
.rjp-head { text-align: center; max-width: 760px; margin: 0 auto 26px; }
.rjp-eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: 2.4px; text-transform: uppercase; font-weight: 700; color: #8a6a12; }
.rjp-title { margin: 0 0 10px; font-family: 'Playfair Display',Georgia,'Times New Roman',serif; font-size: 32px; line-height: 1.2; font-weight: 700; color: #14284b; letter-spacing: -.3px; }
.rjp-title::after { content: ""; display: block; width: 56px; height: 3px; margin: 14px auto 0; border-radius: 3px;
  background: linear-gradient(90deg, #c9a227, #f3e3a6); }
.rjp-lead { margin: 0 auto 18px; font-size: 16px; line-height: 1.65; color: #57606a; }

.rjp-stats { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center;
  border: 1px solid #e5e7eb; border-radius: 14px; background: #fff; box-shadow: 0 8px 24px rgba(11,26,51,.06); overflow: hidden; }
.rjp-stats li { flex: 1 1 140px; padding: 14px 16px; border-right: 1px solid #e5e7eb; }
.rjp-stats li:last-child { border-right: 0; }
.rjp-stats strong { display: block; font-family: 'Playfair Display',Georgia,'Times New Roman',serif; font-size: 20px; color: #14284b; }
.rjp-stats span { font-size: 12.5px; color: #57606a; letter-spacing: .3px; }

/* ---------- Filter chips ---------- */
.rjp-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 26px 0 24px; }
.rjp-chip { font: 600 13.5px/1 Inter,'Segoe UI',Roboto,Arial,sans-serif; padding: 10px 16px; border-radius: 999px; cursor: pointer;
  border: 1px solid #e5e7eb; background: #fff; color: #14284b; transition: all .18s ease; }
.rjp-chip:hover, .rjp-chip:focus { border-color: #c9a227; color: #0b1a33; }
.rjp-chip.is-active { background: #14284b; border-color: #14284b; color: #fff; box-shadow: 0 6px 16px rgba(20,40,75,.25); }
.rjp-chip:focus-visible { outline: 2px solid #c9a227; outline-offset: 2px; }

/* ---------- Journal cards ---------- */
.rjp-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.rjp-card { margin: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid #e5e7eb; border-radius: 18px;
  overflow: hidden; box-shadow: 0 1px 3px rgba(15,23,42,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.rjp-card[hidden] { display: none; }
.rjp-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,26,51,.14); border-color: transparent; }

.rjp-stage { position: relative; display: flex; align-items: center; justify-content: center; padding: 26px 20px 22px; min-height: 236px;
  background-color: var(--j-deep);
  background-image: radial-gradient(rgba(255,255,255,.10) 1px, transparent 1.2px),
                    radial-gradient(circle at 85% 10%, var(--j-glow) 0, transparent 50%),
                    linear-gradient(140deg, var(--j-deep) 0%, var(--j-primary) 100%);
  background-size: 16px 16px, auto, auto; text-decoration: none !important; }
.rjp-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px;
  background: linear-gradient(90deg, var(--j-accent), var(--j-glow)); }
.rjp-cover { display: block; width: 132px; max-width: 46%; height: auto; border-radius: 6px;
  box-shadow: 0 16px 34px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.16); transform: rotate(-2deg); transition: transform .3s ease; }
.rjp-card:hover .rjp-cover { transform: rotate(0deg) scale(1.05); }
.rjp-cover-blank { width: 132px; height: 186px; display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 10px; color: #fff; font: 700 18px/1.2 'Playfair Display',Georgia,'Times New Roman',serif; background: rgba(255,255,255,.08); }

.rjp-body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 20px; }
.rjp-acronym { align-self: flex-start; font: 700 11.5px/1 Inter,'Segoe UI',Roboto,Arial,sans-serif; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--j-text); background: #fff; border: 1px solid currentColor; border-radius: 999px; padding: 5px 10px; margin: 0 0 10px; }
.rjp-name { margin: 0 0 4px; font-family: 'Playfair Display',Georgia,'Times New Roman',serif; font-size: 20px; line-height: 1.25; font-weight: 700; }
.rjp-name a { color: #0b1a33 !important; text-decoration: none !important; }
.rjp-name a:hover, .rjp-name a:focus { color: var(--j-text) !important; }
.rjp-field { margin: 0 0 10px; font-size: 12.5px; font-weight: 600; letter-spacing: .4px; color: var(--j-text); }
.rjp-summary { margin: 0 0 16px; font-size: 14px; line-height: 1.6; color: #57606a;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rjp-actions { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.rjp-btn { display: inline-block; padding: 9px 16px; border-radius: 999px; font: 600 13.5px/1.2 Inter,'Segoe UI',Roboto,Arial,sans-serif; text-decoration: none !important;
  color: #fff !important; background: var(--j-primary); box-shadow: 0 6px 14px rgba(0,0,0,.12); transition: background .18s ease, transform .18s ease; }
.rjp-btn:hover, .rjp-btn:focus { background: var(--j-text); transform: translateY(-1px); }
.rjp-link { font: 600 13.5px/1.2 Inter,'Segoe UI',Roboto,Arial,sans-serif; color: var(--j-text) !important; text-decoration: none !important; border-bottom: 1px solid transparent; }
.rjp-link:hover, .rjp-link:focus { border-bottom-color: currentColor; }
.rjp-btn:focus-visible, .rjp-link:focus-visible, .rjp-name a:focus-visible { outline: 2px solid #c9a227; outline-offset: 2px; }

/* The theme sets large margins and its own font on every h3 and p in the main column; keep the cards compact */
.pkp_structure_main .rjp-card .rjp-name { margin: 0 0 6px; font-family: 'Playfair Display',Georgia,'Times New Roman',serif; font-size: 20px; line-height: 1.25; font-weight: 700; }
.pkp_structure_main .rjp-card .rjp-field { margin: 0 0 10px; line-height: 1.45; }
.pkp_structure_main .rjp-card .rjp-summary { margin: 0 0 16px; line-height: 1.6; }

/* ---------- About blocks (hero, why publish): links and hover ---------- */
.rjp-about a.rjh-btn { transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease; }
.rjp-about a.rjh-btn:hover, .rjp-about a.rjh-btn:focus { transform: translateY(-1px); text-decoration: none !important; }
.rjp-about .rjh-card { transition: transform .2s ease, box-shadow .2s ease; }
.rjp-about .rjh-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(11,26,51,.10) !important; }
.rjf-link:hover, .rjf-link:focus { color: #f3e3a6 !important; text-decoration: underline !important; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) { .rjp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .rjp-grid { grid-template-columns: 1fr; gap: 18px; }
  .rjp-title { font-size: 26px; }
  .rjp-stats li { flex: 1 1 50%; box-sizing: border-box; border-bottom: 1px solid #e5e7eb; }
  .rjp-stage { min-height: 210px; }
  .rjp-about .rjh-hero > div { padding: 30px 22px !important; }
  .rjp-about .rjh-hero h2 { font-size: 30px !important; }
  .rjp-about .rjh-hero img { width: 46px !important; margin-right: -10px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .rjp-card, .rjp-cover, .rjp-btn, .rjp-chip { transition: none !important; }
  .rjp-card:hover, .rjp-card:hover .rjp-cover { transform: none; }
}