/*
 * Invaris Premium — native OJS and plugin-facing frontend components.
 * Keeps OJS data, routes and hooks intact while providing a consistent
 * presentation for components that administrators can enable in OJS.
 */

/* Shared shell for optional homepage output. */
.invaris-home-announcements,
.invaris-home-categories,
.invaris-home-latest,
.invaris-home-highlights,
.invaris-additional-content {
  width: 100%;
  min-width: 0;
  margin: 0 0 18px;
}

/* Announcements */
.invaris-home-announcements .cmp_announcements {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin: 0 !important;
  padding: 0 !important;
  border-top: 1px solid #d9e3eb;
  border-bottom: 1px solid #d9e3eb;
  border-left: 0;
  border-right: 0;
  background: #fff;
}
.invaris-home-announcements .cmp_announcements > h2 {
  grid-column: 1 / -1;
  margin: 0 !important;
  padding: 12px 18px 10px !important;
  color: var(--invaris-primary, #002b55);
  background: #f6f8fa;
  border-bottom: 1px solid var(--invaris-heading-accent, #ef6a24) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  text-transform: none !important;
}
.invaris-home-announcements .obj_announcement_summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin: 0 !important;
  padding: 18px !important;
  border: 0 !important;
  background: #fff;
}
.invaris-home-announcements .obj_announcement_summary_has_image {
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
}
.invaris-home-announcements .obj_announcement_summary_image {
  display: block;
  width: 100%;
  max-height: 150px;
  object-fit: contain;
  object-position: left top;
}
.invaris-home-announcements .obj_announcement_summary h3,
.invaris-home-announcements .obj_announcement_summary h4 {
  margin: 0 0 5px !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 17px !important;
  line-height: 1.28 !important;
}
.invaris-home-announcements .obj_announcement_summary h3 a,
.invaris-home-announcements .obj_announcement_summary h4 a {
  color: var(--invaris-primary, #002b55) !important;
  font-weight: 600 !important;
}
.invaris-home-announcements .obj_announcement_summary .date {
  margin: 0 0 8px;
  color: #73818d;
  font-size: 12px;
}
.invaris-home-announcements .obj_announcement_summary .summary {
  color: var(--invaris-text, #555f67);
  font-size: 14px;
  line-height: 1.55;
}
.invaris-home-announcements .obj_announcement_summary .read_more {
  display: inline-flex;
  margin-left: 6px;
  color: var(--invaris-link, #00589b) !important;
  font-weight: 600;
}
.invaris-home-announcements .cmp_announcements > .obj_announcement_summary {
  grid-column: 1;
  min-width: 0;
}
.invaris-home-announcements .cmp_announcements > .more {
  grid-column: 2;
  min-width: 0;
  margin: 0 !important;
  padding: 18px !important;
  border-left: 0;
}
.invaris-home-announcements .cmp_announcements > .more .obj_announcement_summary {
  padding: 0 0 14px !important;
  border-top: 0 !important;
  border-bottom: 1px solid #edf1f4 !important;
}
.invaris-home-announcements .cmp_announcements > .more .obj_announcement_summary:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

/* Categories enabled through OJS. */
.invaris-home-categories .categoryHeader {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #d9e3eb;
  background: #fff;
}
.invaris-home-categories .categoryHeader_categories {
  margin: 0 !important;
  padding: 12px 16px !important;
}
.invaris-home-categories .categories_listing {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.invaris-home-categories .categories_listing > li {
  margin: 0 !important;
  padding: 0 !important;
}
.invaris-home-categories .categories_listing a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 12px;
  color: var(--invaris-primary, #002b55) !important;
  background: #f5f8fa;
  border: 1px solid #d5e0e8;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}
.invaris-home-categories .categories_listing a:hover,
.invaris-home-categories .categories_listing a:focus {
  color: #fff !important;
  background: var(--invaris-primary, #002b55);
  border-color: var(--invaris-primary, #002b55);
}

/* Latest Published Publications from native OJS. */
.invaris-home-latest .latest_articles {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #d9e3eb;
  background: #fff;
}
.invaris-home-latest .latest_articles > h2,
.invaris-home-latest .latest_articles > h3 {
  margin: 0 !important;
  padding: 12px 18px 10px !important;
  color: var(--invaris-primary, #002b55);
  background: #f6f8fa;
  border-bottom: 1px solid var(--invaris-heading-accent, #ef6a24) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}
.invaris-home-latest .latest_articles .cmp_article_list {
  margin: 0 !important;
  padding: 0 !important;
}
.invaris-home-latest .latest_articles .cmp_article_list > li {
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #e8edf1 !important;
}
.invaris-home-latest .latest_articles .cmp_article_list > li:last-child {
  border-bottom: 0 !important;
}
.invaris-home-latest .latest_articles .obj_article_summary {
  padding: 14px 18px !important;
}

/* Highlights: keep native structure but make cards belong to Invaris. */
.invaris-home-highlights .highlights,
.invaris-home-highlights .cmp_highlights,
.invaris-home-highlights .highlight {
  box-sizing: border-box;
}
.invaris-home-highlights .highlight,
.invaris-home-highlights [class*="highlight_"] {
  border-color: #d9e3eb;
}
.invaris-home-highlights a {
  color: var(--invaris-link, #00589b);
}

/* Additional Homepage Content edited in OJS. */
.invaris-additional-content {
  box-sizing: border-box;
  padding: 18px 20px !important;
  color: var(--invaris-text, #555f67);
  background: #f8fafb;
  border: 1px solid #e0e7ec;
  line-height: 1.6;
}
.invaris-additional-content > :first-child { margin-top: 0 !important; }
.invaris-additional-content > :last-child { margin-bottom: 0 !important; }
.invaris-additional-content h2,
.invaris-additional-content h3 {
  color: var(--invaris-primary, #002b55) !important;
}

/* Generic OJS/plugin UI that may be injected through supported hooks. */
.pkp_structure_main .cmp_notification,
.pkp_structure_main .cmp_form,
.pkp_structure_main .cmp_pagination,
.pkp_structure_main .pkp_notification {
  box-sizing: border-box;
  max-width: 100%;
}
.pkp_structure_main .cmp_notification,
.pkp_structure_main .pkp_notification {
  border-radius: 0 !important;
  border-left: 4px solid var(--invaris-primary, #002b55) !important;
}
.pkp_structure_main .cmp_pagination {
  margin-top: 16px !important;
  padding-top: 12px !important;
  border-top: 1px solid #d9e3eb;
}
.pkp_structure_main .cmp_pagination a {
  color: var(--invaris-link, #00589b) !important;
  font-weight: 600;
}
.pkp_structure_main .pkp_button,
.pkp_structure_main button.pkp_button,
.pkp_structure_main input[type="submit"] {
  border-radius: 3px !important;
}
.pkp_structure_main .pkp_button:not(.warnable),
.pkp_structure_main button.pkp_button:not(.warnable) {
  border-color: var(--invaris-primary, #002b55) !important;
}

/* Plugin block output remains controlled by OJS placement but uses Invaris shell. */
.pkp_structure_sidebar .pkp_block iframe,
.pkp_structure_sidebar .pkp_block video,
.pkp_structure_sidebar .pkp_block table {
  max-width: 100%;
}
.pkp_structure_sidebar .pkp_block input,
.pkp_structure_sidebar .pkp_block select,
.pkp_structure_sidebar .pkp_block textarea,
.pkp_structure_sidebar .pkp_block button {
  max-width: 100%;
}

/* Hook output must never escape the content column. */
.page_index_journal > *,
.pkp_structure_main > * {
  max-width: 100%;
}

@media (max-width: 767.98px) {
  .invaris-home-announcements .cmp_announcements {
    grid-template-columns: 1fr;
  }
  .invaris-home-announcements .cmp_announcements > h2,
  .invaris-home-announcements .cmp_announcements > .obj_announcement_summary,
  .invaris-home-announcements .cmp_announcements > .more {
    grid-column: 1;
  }
  .invaris-home-announcements .cmp_announcements > .more {
    padding-top: 0 !important;
    border-left: 0;
    border-top: 1px solid #cfd7de;
  }
  .invaris-home-announcements .obj_announcement_summary_has_image {
    grid-template-columns: 1fr;
  }
  .invaris-home-announcements .obj_announcement_summary_image {
    max-width: 180px;
  }
  .invaris-home-categories .categories_listing {
    gap: 6px;
  }
  .invaris-home-categories .categories_listing a {
    min-height: 32px;
    padding: 6px 10px;
  }
}


/* Native homepage hook surface used by generic plugins. */
.invaris-home-hook {
  width: 100%;
  min-width: 0;
  margin: 0 0 18px;
}
.invaris-home-hook:empty {
  display: none;
}
.invaris-home-hook > * {
  max-width: 100%;
}

/* Exact OJS 3.5 Highlights markup. */
.invaris-home-highlights .highlights {
  margin: 0 !important;
}
.invaris-home-highlights .swiper {
  overflow: hidden;
  border: 1px solid #d9e3eb;
  background: #fff;
}
.invaris-home-highlights .swiper-wrapper {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.invaris-home-highlights .swiper-slide {
  box-sizing: border-box;
  min-height: 180px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
}
.invaris-home-highlights .swiper-slide.-has-image {
  grid-template-columns: minmax(180px, 32%) minmax(0, 1fr);
}
.invaris-home-highlights .swiper-slide-image {
  width: 100%;
  height: 100%;
  min-height: 180px;
  object-fit: cover;
}
.invaris-home-highlights .swiper-slide-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0;
  padding: 22px 24px;
}
.invaris-home-highlights .swiper-slide-title {
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--invaris-primary, #002b55) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}
.invaris-home-highlights .swiper-slide-desc {
  margin: 0 0 14px;
  color: var(--invaris-text, #555f67);
  font-size: 14px;
  line-height: 1.55;
}
.invaris-home-highlights .swiper-slide-button {
  display: inline-flex !important;
  align-items: center;
  min-height: 36px;
  padding: 8px 14px !important;
  color: #fff !important;
  background: var(--invaris-primary, #002b55) !important;
  border: 1px solid var(--invaris-primary, #002b55) !important;
  border-radius: 3px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
.invaris-home-highlights .swiper-slide-button:hover,
.invaris-home-highlights .swiper-slide-button:focus {
  background: var(--invaris-primary-dark, #00203f) !important;
  border-color: var(--invaris-primary-dark, #00203f) !important;
}
.invaris-home-highlights .swiper-button-prev,
.invaris-home-highlights .swiper-button-next {
  color: var(--invaris-primary, #002b55);
}
.invaris-home-highlights .swiper-pagination-bullet-active {
  background: var(--invaris-primary, #002b55);
}

/* Common native/plugin HTML inside hook and sidebar surfaces. */
.invaris-home-hook h2,
.invaris-home-hook h3,
.pkp_structure_sidebar .pkp_block h2,
.pkp_structure_sidebar .pkp_block h3 {
  overflow-wrap: anywhere;
}
.invaris-home-hook img,
.invaris-home-hook iframe,
.invaris-home-hook video,
.invaris-home-hook table {
  max-width: 100%;
}
.invaris-home-hook table {
  width: 100%;
  border-collapse: collapse;
}
.invaris-home-hook input,
.invaris-home-hook select,
.invaris-home-hook textarea,
.invaris-home-hook button {
  max-width: 100%;
}

@media (max-width: 767.98px) {
  .invaris-home-highlights .swiper-slide.-has-image {
    grid-template-columns: 1fr;
  }
  .invaris-home-highlights .swiper-slide-image {
    max-height: 220px;
  }
  .invaris-home-highlights .swiper-slide-content {
    padding: 18px;
  }
}


/* Override Default Theme announcement column separators. */
.invaris-home-announcements .cmp_announcements > .obj_announcement_summary::before,
.invaris-home-announcements .cmp_announcements > .more::before {
  content: none !important;
  display: none !important;
  border: 0 !important;
}

@media (min-width: 768px) {
  .invaris-home-announcements .cmp_announcements > .obj_announcement_summary,
  .invaris-home-announcements .cmp_announcements > .more {
    float: none !important;
    width: auto !important;
  }
}


/* Official OJS recommendation plugins injected after the article. */
#articlesBySameAuthorList,
#articlesBySimilarityList {
  box-sizing: border-box;
  width: 100%;
  margin: 22px 0 0 !important;
  padding: 18px 20px !important;
  border: 1px solid #d9e3eb;
  border-top: 3px solid var(--invaris-primary, #002b55);
  background: #f8fafb;
}

#articlesBySameAuthorList > h2,
#articlesBySimilarityList > h2 {
  margin: 0 0 12px !important;
  padding: 0 0 9px !important;
  color: var(--invaris-primary, #002b55) !important;
  border-bottom: 1px solid var(--invaris-heading-accent, #ef6a24) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

#articlesBySameAuthorList ul,
#articlesBySimilarityList ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#articlesBySameAuthorList li,
#articlesBySimilarityList li {
  margin: 0 !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid #e3e9ee;
  line-height: 1.5;
}

#articlesBySameAuthorList li:last-child,
#articlesBySimilarityList li:last-child {
  border-bottom: 0;
}

#articlesBySameAuthorList a,
#articlesBySimilarityList a {
  color: var(--invaris-link, #00589b) !important;
  font-weight: 600;
}

#articlesBySameAuthorPages,
#articlesBySimilarityPages,
#articlesBySimilaritySearch {
  margin: 12px 0 0 !important;
  padding-top: 10px;
  border-top: 1px solid #d9e3eb;
}

/* Login/registration plugin extension surfaces. */
.invaris-login-route-host > [class*="plugin"],
.invaris-register-page > [class*="plugin"],
.page_login > [class*="plugin"],
.page_register > [class*="plugin"] {
  max-width: 100%;
}

.invaris-login-modal .modal-content > :not(.modal-header):not(.modal-footer):not(form):not(.invaris-login-modal-accent),
.invaris-register-page > :not(h1):not(.cmp_form):not(.breadcrumbs) {
  overflow-wrap: anywhere;
}


/* ==========================================================================
   Plugin UI compatibility — article integrations
   ========================================================================== */

/* Publication Facts Label (PFL). The plugin injects this through
   Templates::Article::Details into the native article-details sidebar. */
.obj_article_details .pflPlugin {
  display: block !important;
  box-sizing: border-box;
  width: 100%;
  margin: 0 !important;
  padding: 16px !important;
  overflow: visible !important;
  border-bottom: 1px solid #d9e3eb !important;
  background: #fff;
}

.obj_article_details .pflPlugin publication-facts-label {
  display: block !important;
  width: 100%;
  min-width: 0;
  overflow: visible;
}

/* Citation Style Language plugin. */
.obj_article_details .citation_display {
  box-sizing: border-box;
  width: 100%;
}

.obj_article_details .citation_display #citationOutput {
  overflow-wrap: anywhere;
}

.obj_article_details .citation_formats {
  overflow: visible;
  border: 1px solid #d9e3eb !important;
  border-radius: 3px !important;
  background: #fff;
}

.obj_article_details .citation_formats_button {
  color: var(--invaris-primary, #002b55) !important;
}

.obj_article_details .citation_formats_styles a {
  color: var(--invaris-link, #00589b) !important;
}

/* Crossmark-compatible custom element, when supplied by a Crossref plugin. */
.obj_article_details pkp-crossmark-button,
.invaris-article-frame pkp-crossmark-button {
  display: block;
  max-width: 100%;
  margin: 10px 0;
}

/* ORCID/Credit metadata remain readable inside the native article details. */
.obj_article_details .orcid,
.obj_article_details .credit_roles,
.obj_article_details .contributor_roles {
  overflow-wrap: anywhere;
}

.obj_article_details .orcid a {
  color: var(--invaris-link, #00589b) !important;
}

/* Public comments and Vue-powered plugin/native widgets. */
.obj_article_details [data-vue-root],
.obj_article_details pkp-comments,
.obj_article_details pkp-scroll-to-comments {
  max-width: 100%;
}

/* Subscription and purchase-related frontend controls use native routes.
   Only normalize presentation; do not replace their OJS forms. */
.page_subscriptions .cmp_form,
.page_subscription .cmp_form,
.page_purchase_subscription .cmp_form,
.page_user_subscriptions .cmp_form {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}

.page_subscriptions .pkp_button,
.page_subscription .pkp_button,
.page_purchase_subscription .pkp_button,
.page_user_subscriptions .pkp_button {
  border-color: var(--invaris-primary, #002b55) !important;
}

/* Static Pages and generic plugin page output. */
.page_static,
.page_static_page,
.pkp_page_staticPage .page {
  max-width: 100%;
}

.page_static img,
.page_static_page img,
.pkp_page_staticPage img,
.page_static iframe,
.page_static_page iframe,
.pkp_page_staticPage iframe {
  max-width: 100%;
  height: auto;
}


/* ==========================================================================
   Plugin UI compatibility — sidebar, footer and utility plugins
   ========================================================================== */

/* Announcement Feed / Web Feed blocks. */
.pkp_structure_sidebar .block_announcement_feed ul,
.pkp_structure_sidebar .block_web_feed ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.pkp_structure_sidebar .block_announcement_feed li,
.pkp_structure_sidebar .block_web_feed li {
  margin: 0 !important;
  padding: 0 !important;
}

.pkp_structure_sidebar .block_announcement_feed a,
.pkp_structure_sidebar .block_web_feed a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 5px 8px;
  border: 1px solid #d9e3eb;
  background: #fff;
}

.pkp_structure_sidebar .block_announcement_feed img,
.pkp_structure_sidebar .block_web_feed img {
  display: block;
  max-width: 88px;
  max-height: 24px;
  width: auto;
  height: auto;
}

/* Partner Logos plugin. */
.pl-partner-logos {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  gap: 10px;
}

.pl-partner-logo {
  box-sizing: border-box !important;
  flex: 1 1 150px !important;
  width: auto !important;
  max-width: 220px !important;
  height: 110px !important;
  max-height: 110px !important;
  padding: 12px !important;
  border: 1px solid #e0e7ec;
  background: #fff;
}

.pl-partner-logo-img {
  max-width: 100% !important;
  max-height: 82px !important;
}

/* Cookie Notice plugin.
 * Restore the established Invaris full-width dark consent bar. The plugin
 * keeps ownership of consent behavior; the theme owns presentation only. */
#cookie-notice {
  position: fixed !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10000 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 16px 20px !important;
  color: #fff !important;
  background: rgba(20, 24, 28, .97) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, .18) !important;
  font-family: var(--invaris-font-sans, "IBM Plex Sans", "Segoe UI", Arial, sans-serif) !important;
}

#cookie-notice .cookie-notice__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#cookie-notice .cookie-notice__content {
  min-width: 0 !important;
}

#cookie-notice .cookie-notice__title {
  display: none !important;
}

#cookie-notice .cookie-notice__text {
  max-width: none !important;
  margin: 0 !important;
  color: inherit !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

#cookie-notice .cookie-notice__button {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  padding: 8px 18px !important;
  color: #fff !important;
  background: transparent !important;
  border: 1px solid #fff !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

#cookie-notice .cookie-notice__button:hover,
#cookie-notice .cookie-notice__button:focus-visible {
  color: #14181c !important;
  background: #fff !important;
  border-color: #fff !important;
}

@media (max-width: 640px) {
  #cookie-notice {
    padding: 14px 16px !important;
  }

  #cookie-notice .cookie-notice__inner {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  #cookie-notice .cookie-notice__button {
    width: 100% !important;
  }
}

/* View Counter plugin. */
.viewcounter-stats {
  display: inline-flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  color: #667580;
  font-size: 12px;
  line-height: 1.4;
}

.viewcounter-stats > span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.viewcounter-stats svg {
  flex: 0 0 auto;
  color: var(--invaris-primary, #002b55);
}

.obj_article_summary .viewcounter-stats {
  margin-top: 7px;
}

.obj_article_details .viewcounter-stats--details {
  margin: 8px 0 4px;
}

/* Generic plugin-provided rich content must remain responsive. */
.pkp_structure_main .pl-partner-logos,
.pkp_structure_main .viewcounter-stats,
.pkp_structure_sidebar .pl-partner-logos {
  max-width: 100%;
}

@media (max-width: 767.98px) {
  .pl-partner-logo {
    flex-basis: 120px !important;
    max-width: 180px !important;
    height: 90px !important;
  }
}