header .container {
    background: url(https://journal.uptm.edu.my/public/site/images/uptm/header-evolusi.png);
    box-shadow: 0px 1px 18px -10px rgb(39 39 136 / 75%);
    border-right: 1px solid white;
    border-left: 1px solid white;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.container.main_menu {
    background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
}

.container.main_menu #nav-menu .nav > li > a {
    color: #680201;
    font-weight: 500;
}

.header_view .nav>li>a {
    color: #ffffff;
}

div.issn {
    display: flex;
    justify-content: flex-end;
    gap: 3rem;
    padding-top: 30px;
    text-align: right;
    padding-bottom: 6px;
}

div.issn span {
    font-weight: bold;
    color: rgb(255, 255, 255);
    padding: 5px;
    border-radius: 3px;
}

.pkp_block .title {
    border-bottom: 4px solid #680201;
}

.pkp_block h2.title, .pkp_block .content span.title, .pkp_block span.title {
    color: #680201;
    font-weight: 500;
}

.pkp_block .title {
    background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
}

.navbar-brand-logo img {
    max-height: 100%;
    width: auto;
    display: none;
}

#navigationUser > li > a {
    background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
}

#headerNavigationContainer > div:nth-child(1) > div {
    height: 96px;
}

.doiInSummary {
    margin: 5px 0;
    display: none;
}

.article-summary.media {
    background: #f0f0f0;
    padding: 14px;
    border-radius: 5px;
    border-bottom: 2px solid #000000;
    box-shadow: 0px 1px 18px -10px rgb(39 39 136 / 75%);
}

footer .container {
    background: url(https://journal.uptm.edu.my/public/site/images/uptm/footer-evolusi.png);
    color: #ffffff;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #8a0101;
}


.copy-right {
    background: #ffffff;
    padding: 10px;
    border-radius: 5px;
    color: #000000;
}


footer h4 {
    color: #000000;
    background: linear-gradient(45deg, #ffffff, transparent);
    font-weight: 700;
    padding: 5px;
    border-radius: 5px;
    border-bottom: 2px solid #cfa467;
}

footer a {
    color: #ffde63;
}

.copy-right a {
    color: #001eff;
}


@media (max-width: 767px) {
    div.issn span {
        font-weight: bold;
        color: rgb(0 0 0);
        padding: 5px;
        border-radius: 3px;
    }

    footer .container {
        background: linear-gradient(45deg, #400101, #7e100f);
        color: #ffffff;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
    }
    div.issn {
        padding-top: 55px;
        padding-bottom: 6px;
    }

    #headerNavigationContainer > div:nth-child(1) > div {
        height: 45px;
    }
}


/* ============================================================
   evolusi — article summary layout tweak
   Moves FULLTEXT [PDF] from its own row up beside the Citations
   (Dimensions) badge, vertically level with it.

   Upload via: Settings > Website > Appearance > Advanced
> Journal Style Sheet
   ============================================================ */

/* Card body becomes the flex context so .btn-group can join the
   metadata row (it is a sibling of .row.py-4 in the markup). */
.article-summary .media-body > .col-md-12 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

/* Category / title / authors keep their own full-width lines. */
.article-summary .media-body > .col-md-12 > .mb-3,
.article-summary .media-body > .col-md-12 > .media-heading,
.article-summary .media-body > .col-md-12 > .meta {
  flex: 0 0 100%;
  max-width: 100%;
}

/* Dissolve the row: its columns become items of the flex context
   above, so the button can be ordered among them. */
.article-summary .row.py-4 {
  display: contents;
}

/* 1. Citations badge — shrink column to the badge's real width
   (the wrapper renders as a 341px block by default). */
.article-summary .row.py-4 > div:nth-child(1) {
  order: 1;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  padding-top: 0;
  padding-right: 0;
  margin-top: 1.5rem;
  align-self: center;
}
.article-summary .__dimensions_badge_embed__ {
  display: inline-block;
  width: auto;
  vertical-align: middle;
}

/* 2. FULLTEXT [PDF] — beside the badge.
   margin-left = gap (~14px), top = optical nudge. */
.article-summary .btn-group {
  order: 2;
  align-self: center;
  margin-left: 0.85rem;
  margin-top: 1.5rem;
  position: relative;
  top: -3px;
}

/* Default Bootstrap .btn padding makes the button 30px tall against
   a 22px badge, which overhangs. These values match their heights. */
.article-summary .btn-group .galley-link {
  padding: 0.3rem 1rem;
  font-size: 1.125rem;
  line-height: 1.25;
}

/* 3. Page range — stays anchored to the right edge. */
.article-summary .row.py-4 > .page_number {
  order: 3;
  flex: 0 0 auto;
  max-width: none;
  margin-left: auto;
  margin-top: 1.5rem;
  padding-top: 0;
  align-self: center;
}

/* 4-5. Abstract views / downloads, then DOI. */
.article-summary .row.py-4 > .article_statistic {
  order: 4;
}
.article-summary .row.py-4 > div:nth-child(4) {
  order: 5;
  padding-bottom: 1.5rem;
}