/* =========================================================
   AL-AMĪN (FAIṢALĀBĀD)
   A Research Journal of Islamic & Social Sciences
   Layout: same as the OK_OK sheet (hero banner, full width,
   nav strip, sidebar on the right)
   Colors: Dark green • Light green • Golden
   PART 1 = original Al-Amīn sidebar (unchanged)
   PART 2 = OK_OK layout recolored to green / gold
   ========================================================= */

/* ############ PART 1 — SIDEBAR (UNCHANGED) ############ */

/* =========================================================
   AL-AMĪN (FAIṢALĀBĀD)
   Pastel Academic Journal Theme
   ========================================================= */

:root {
    --cream: #fbf8f1;
    --ivory: #fffdf8;
    --sage: #a8bfa3;
    --sage-dark: #71866c;
    --dusty-blue: #aebfd1;
    --lavender: #c9bdd8;
    --rose: #d9b8b5;
    --peach: #e7c6a5;
    --gold: #c9ad72;
    --text: #3f4642;
    --muted: #737873;
    --border: #e3ded3;
    --shadow: 0 8px 25px rgba(70, 70, 60, 0.10);
}

/* =========================================================
   MAIN SIDEBAR
   ========================================================= */

.pkp_structure_sidebar {
    background: transparent;
    padding: 12px;
}

.pkp_block {
    background: var(--ivory);
    border: 1px solid var(--border);
    border-radius: 16px;
    margin-bottom: 18px;
    padding: 18px;
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
    transition: all 0.35s ease;
}

.pkp_block:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(70,70,60,0.14);
}

/* =========================================================
   MOVING PASTEL COLOR PLATE
   ========================================================= */

.pkp_block::before {
    content: "";
    position: absolute;
    top: 0;
    left: -80px;
    width: 150px;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(201,173,114,0.12),
        transparent
    );
    transform: skewX(-20deg);
    transition: left 0.7s ease;
}

.pkp_block:hover::before {
    left: 110%;
}

/* =========================================================
   SIDEBAR HEADINGS
   ========================================================= */

.pkp_block_title {
    font-family: "Times New Roman", Georgia, serif;
    color: var(--sage-dark);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    padding-bottom: 10px;
    margin-bottom: 12px;
    border-bottom: 2px solid #e8e1d4;
}

/* =========================================================
   SIDEBAR LINKS
   ========================================================= */

.pkp_block ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pkp_block li {
    margin: 6px 0;
}

.pkp_block li a {
    display: block;
    padding: 10px 13px;
    border-radius: 10px;
    color: var(--text);
    text-decoration: none;
    font-family: "Times New Roman", Georgia, serif;
    font-size: 0.98rem;
    transition:
        transform 0.3s ease,
        background 0.3s ease,
        padding-left 0.3s ease,
        box-shadow 0.3s ease;
}

/* Moving slide effect */

.pkp_block li a:hover {
    background: #eef3eb;
    color: var(--sage-dark);
    padding-left: 21px;
    transform: translateX(5px);
    box-shadow: 0 4px 12px rgba(100,120,90,0.10);
}

/* =========================================================
   PASTEL COLOR PLATES
   ========================================================= */

.pkp_block:nth-child(1) {
    border-left: 5px solid var(--sage);
}

.pkp_block:nth-child(2) {
    border-left: 5px solid var(--dusty-blue);
}

.pkp_block:nth-child(3) {
    border-left: 5px solid var(--lavender);
}

.pkp_block:nth-child(4) {
    border-left: 5px solid var(--rose);
}

.pkp_block:nth-child(5) {
    border-left: 5px solid var(--peach);
}

/* =========================================================
   ANIMATED FEATURE PLATES
   ========================================================= */

.amm-feature-plate {
    position: relative;
    overflow: hidden;
    padding: 20px;
    margin: 18px 0;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: linear-gradient(
        135deg,
        #fffdf8,
        #f4f0e8
    );
    box-shadow: var(--shadow);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.amm-feature-plate:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 38px rgba(70,70,60,0.14);
}

/* Sliding light */

.amm-feature-plate::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 80%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,0.55),
        transparent
    );
    transform: skewX(-20deg);
    transition: left 0.8s ease;
}

.amm-feature-plate:hover::after {
    left: 130%;
}

/* =========================================================
   PASTEL SLIDE CARDS
   ========================================================= */

.amm-slide-card {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 17px 20px;
    margin: 12px 0;
    border-radius: 15px;
    background: var(--ivory);
    border: 1px solid var(--border);
    box-shadow: 0 5px 18px rgba(70,70,60,0.08);
    transition: all 0.4s ease;
}

.amm-slide-card:hover {
    transform: translateX(10px);
    box-shadow: 0 10px 25px rgba(70,70,60,0.13);
}

/* Different pastel plates */

.amm-slide-card.sage {
    background: #edf3ea;
}

.amm-slide-card.blue {
    background: #edf2f7;
}

.amm-slide-card.lavender {
    background: #f2eef6;
}

.amm-slide-card.rose {
    background: #f7eeee;
}

.amm-slide-card.peach {
    background: #faf0e5;
}

/* =========================================================
   JOURNAL TITLE
   ========================================================= */

.journal-title-main {
    display: block;
    font-family: "Times New Roman", Georgia, serif;
    font-size: 2rem;
    font-weight: 700;
    color: #526451;
    text-align: center;
    line-height: 1.2;
}

.journal-title-subtitle {
    display: block;
    margin-top: 7px;
    font-family: "Times New Roman", Georgia, serif;
    font-size: 1rem;
    font-style: italic;
    font-weight: 400;
    color: #77766f;
    text-align: center;
}

/* =========================================================
   ELEGANT GOLD DIVIDER
   ========================================================= */

.amm-divider {
    width: 85px;
    height: 2px;
    margin: 12px auto 20px;
    background: var(--gold);
    border-radius: 10px;
    position: relative;
}

.amm-divider::before,
.amm-divider::after {
    content: "";
    position: absolute;
    top: -3px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--gold);
}

.amm-divider::before {
    left: -5px;
}

.amm-divider::after {
    right: -5px;
}

/* =========================================================
   SMOOTH SLIDE ANIMATION
   ========================================================= */

@keyframes gentleSlide {
    0% {
        opacity: 0;
        transform: translateY(12px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.amm-slide-card,
.amm-feature-plate {
    animation: gentleSlide 0.7s ease both;
}

/* =========================================================
   RESPONSIVE DESIGN
   ========================================================= */

@media (max-width: 768px) {

    .pkp_block {
        border-radius: 13px;
        padding: 15px;
    }

    .journal-title-main {
        font-size: 1.55rem;
    }

    .journal-title-subtitle {
        font-size: 0.9rem;
    }

    .amm-slide-card {
        padding: 14px;
    }
}

/* ############ PART 2 — OK_OK LAYOUT, GREEN + GOLD ############ */

/* General page background */
body {
  background-color: #f1f6e8; /* soft light green */
  background-image: linear-gradient(to bottom right, #f1f6e8, #dbe8c9);
  color: #222;
  font-family: "Open Sans", sans-serif;
  margin: 0;
  padding: 0;
}

/* Navigation bar and search container */
.nav-search-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #234b36; /* dark green */
  border-bottom: 3px solid #d4af37;
  padding: 0 30px;
  flex-wrap: nowrap;
}

/* Navigation bar links */
.pkp_navigation_primary {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.pkp_navigation_primary a {
  color: #fff;
  text-decoration: none;
  padding: 14px 20px;
  font-size: 16px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.pkp_navigation_primary a:hover {
  background-color: #d4af37;
  color: #000;
  border-radius: 4px;
}

/* Search box */
.pkp_search {
  display: flex;
  align-items: center;
  background: linear-gradient(to right, #e4eddb, #cfe0c3);
  border: 2px solid #d4af37;
  border-radius: 30px;
  padding: 5px 14px;
  box-shadow: 0 0 10px rgba(212,175,55,0.3);
  transition: all 0.3s ease-in-out;
  height: 40px;
  margin-left: 15px;
  min-width: 240px;
}

.pkp_search:hover {
  box-shadow: 0 0 15px rgba(212,175,55,0.6);
}

.pkp_search::before {
  content: "🔍";
  font-size: 18px;
  margin-right: 10px;
  color: #234b36;
}

.pkp_search input[type="text"],
.pkp_search input[type="search"] {
  border: none;
  outline: none;
  background: transparent;
  font-size: 16px;
  font-weight: 600;
  color: #000;
  width: 100%;
}

.pkp_search input::placeholder {
  color: #4f6b55;
  opacity: 0.8;
}

/* Search button */
.pkp_search button {
  background-color: #d4af37;
  color: #000;
  border: none;
  border-radius: 20px;
  padding: 6px 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
}
.pkp_search button:hover {
  background-color: #234b36;
  color: #fff;
}

/* Main content box */
.pkp_structure_main {
  background-color: #fbfdf6;
  border: 2px solid #d4af37;
  border-radius: 12px;
  padding: 25px;
  margin-top: 20px;
  box-shadow: 0 0 15px rgba(212,175,55,0.25);
}

/* Footer */
.pkp_structure_footer_wrapper {
  background-color: #234b36;
  color: #fff;
  padding: 20px;
  text-align: center;
  border-top: 3px solid #d4af37;
}

/* Buttons */
.pkp_button {
  background-color: #d4af37;
  color: #000;
  border-radius: 5px;
  border: 1px solid #234b36;
  padding: 8px 16px;
}
.pkp_button:hover {
  background-color: #234b36;
  color: #fff;
}

/* =========================================================
   OJS 3.4 – Professional Enhancement (No Layout Disturbance)
   Theme: Golden – Dark Green – Light Green Highlights
   ========================================================= */

/* ----- Issue Page: Article Titles ----- */
.obj_issue_toc .title a,
.obj_issue_toc .title {
    font-family: "Times New Roman", serif;
    font-size: 1.25rem !important;
    font-weight: bold !important;
    color: #234b36 !important; /* Dark Green */
    text-shadow: 0 0 1px #d9a441; /* Soft golden glow */
    text-decoration: none !important;
}
.obj_issue_toc .title a:hover {
    color: #315c45 !important;
    text-decoration: underline solid #d9a441 !important;
}

/* ----- Author Names (Issue + Article Loading Pages) ----- */
.obj_issue_toc .authors,
.obj_issue_toc .authors a,
.obj_article_details .authors,
.obj_article_details .authors a {
    color: #315c45 !important; /* Medium Green */
    font-size: 1.05rem !important;
    font-family: "Times New Roman", serif;
    font-weight: 500 !important;
}

/* ----- PDF and XML Buttons (Uniform Style) ----- */
.obj_galley_link.pdf,
.obj_galley_link.xml {
    background-color: #f6faee !important;
    color: #234b36 !important;
    border: 2px solid #b8860b !important;
    border-radius: 12px !important;
    box-shadow: 0 0 10px rgba(184, 134, 11, 0.4);
    font-weight: 600 !important;
    padding: 6px 14px !important;
    transition: all 0.3s ease;
}
.obj_galley_link.pdf:hover,
.obj_galley_link.xml:hover {
    background-color: #e4eddb !important;
    color: #163d2e !important;
    border-color: #d4af37 !important;
}

/* ----- Abstract Section Box ----- */
.obj_article_details .abstract {
    background: #f4f9ea !important;
    border: 2px solid #d4af37 !important;
    border-radius: 10px !important;
    padding: 15px !important;
    box-shadow: 0 0 8px rgba(60, 100, 50, 0.3);
    font-family: "Times New Roman", serif !important;
}

/* ----- Abstract Headings ----- */
.obj_article_details .abstract h2,
.obj_article_details .abstract h3,
.obj_article_details .abstract strong {
    color: #234b36 !important;
    font-weight: bold !important;
    text-decoration: underline solid #d4af37 !important;
    text-underline-offset: 3px;
    font-family: "Times New Roman", serif;
}

/* ----- Article Landing Page Title ----- */
.obj_article_details .page_title {
    color: #234b36 !important; /* Dark Green */
    font-family: "Times New Roman", serif !important;
    font-size: 1.6rem !important;
    font-weight: bold !important;
    text-align: center;
    text-shadow: 0 0 2px #e0c067;
}

/* ----- About the Journal Heading and Text ----- */
.about_section h2,
.about_section h3,
.pkp_structure_main .about h2 {
    color: #234b36 !important;
    font-weight: bold !important;
    text-decoration: underline solid #d4af37;
    text-underline-offset: 4px;
    font-family: "Times New Roman", serif;
}
.about_section,
.about_section p,
.pkp_structure_main .about {
    color: #163d2e !important;
    font-family: "Times New Roman", serif;
    font-size: 1.05rem !important;
}

/* Keep other layout intact */
.pkp_structure_main {
    background: none !important;
}

/* ==========================================
   UNIVERSAL PAGE BOX STYLING (ALL SECTIONS)
   ========================================== */

.pkp_structure_main {
    background-color: #e4eddb;
    border: 2px solid #234b36;
    border-radius: 10px;
    padding: 25px;
    box-shadow: 0 2px 8px rgba(22, 61, 46, 0.15);
}

/* ==========================================
   PAGE HEADINGS (Current, Archives, About, etc.)
   ========================================== */

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3 {
    color: #234b36;
    border-bottom: 3px solid #b8860b;
    padding-bottom: 5px;
    margin-bottom: 15px;
    font-weight: bold;
    font-family: "Times New Roman", serif;
}

/* ==========================================
   PAGE PARAGRAPHS & LINKS
   ========================================== */

.pkp_structure_main p {
    color: #1f3327;
    font-family: "Times New Roman", serif;
    font-size: 16px;
    line-height: 1.6;
}

.pkp_structure_main a {
    color: #234b36;
    text-decoration: underline;
}

.pkp_structure_main a:hover {
    color: #b8860b;
}

/* ==========================================
   REMOVE EDITORIAL BOARD HEADING
   ========================================== */
.page_editorial_team h1,
.page_editorial_team .page_title,
.page_editorial_team header h1 {
    display: none !important;
}

/* ==========================================
   SPECIFIC FIX: GUIDE TO AUTHOR PAGE
   ========================================== */

.page_guidelines h1 {
    visibility: hidden;
    position: relative;
}
.page_guidelines h1::before {
    content: "Guide to Author";
    visibility: visible;
    position: absolute;
    color: #234b36;
    border-bottom: 3px solid #b8860b;
    font-weight: bold;
    font-family: "Times New Roman", serif;
    font-size: 1.8em;
    padding-bottom: 5px;
}

/* =========================================================
   UNIVERSAL FONT UPDATE FOR OJS 3.4
   ========================================================= */

body, 
h1, h2, h3, h4, h5, h6,
p, span, a, li, td, th,
input, select, textarea,
.navbar, .pkp_structure_main, 
.pkp_page_index, .pkp_page_article,
.obj_article_summary, .pkp_site_name,
.obj_announcement_summary, .pkp_footer_content,
.block_custom, .pkp_navigation_primary, .pkp_navigation_user {
  font-family: "Times New Roman", Times, serif !important;
}

body {
  font-size: 16px !important;
  line-height: 1.6 !important;
}
h1 { font-size: 1.8em !important; }
h2 { font-size: 1.6em !important; }
h3 { font-size: 1.4em !important; }
h4, h5, h6 { font-size: 1.2em !important; }

.obj_article_summary, .obj_article_details, .article_details, .abstract {
  font-family: "Times New Roman", Times, serif !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

.block_custom, .pkp_navigation_primary a, .pkp_navigation_user a {
  font-family: "Times New Roman", Times, serif !important;
  font-size: 15px !important;
}

/* =========================================================
   OJS 3.4 CUSTOM FIXES
   ========================================================= */

/* Issue title styling */
.obj_issue_summary .title a,
.obj_issue_toc .title a {
    font-family: "Times New Roman", serif !important;
    font-size: 22px !important;
    font-weight: bold !important;
    color: #234b36 !important;
    text-decoration: none !important;
}

.obj_issue_summary .title a:hover,
.obj_issue_toc .title a:hover {
    color: #B8860B !important;
}

/* --- ABSTRACT SUBHEADINGS --- */
.article-details .abstract strong,
.obj_article_details .abstract b {
  display: block;
  margin-top: 8px;
  font-weight: bold;
  color: #234b36;
  font-size: 1.05em;
}

/* ===== DOI Styling on Article Page ===== */
.obj_article_details .doi {
  font-family: "Times New Roman", Times, serif !important;
  font-size: 1rem !important;
  color: #234b36 !important;
  font-weight: bold !important;
  margin-top: 6px;
}

.obj_article_details .doi a {
  color: #234b36 !important;
  font-weight: bold !important;
  font-size: 1rem !important;
  text-decoration: none !important;
}

.obj_article_details .doi a:hover {
  color: #b8860b !important;
  text-decoration: none !important;
}
/* HIDE KEYWORDS SECTION */
.item.keywords,
.item.keywords * {
    display: none !important;
}
/* FORCE HIDE KEYWORDS – OJS 3.4 ALL THEMES */
.item.keywords,
.pkp_article_details_keywords,
.pkp_article_details_keywords *,
.obj_article_details .keywords,
.obj_article_details .item.keywords,
.section-item.keywords,
.article-details .keywords,
.article-details .item.keywords,
.article_detail .keywords,
.article_detail .item.keywords {
    display: none !important;
}
/* --- MAKE AUTHORS HORIZONTAL --- */
.pkp_authors,
.pkp_authors .authors,
.obj_article_details .authors {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap; /* If many authors, they wrap nicely */
    gap: 10px; /* Space between authors */
}

/* Remove vertical stacking */
.pkp_authors .author,
.obj_article_details .author {
    display: inline-block !important;
    margin-right: 12px;
}


.author{
display:inline-flex;
align-items:center;
gap:0.25rem;
padding:4px 6px;
min-height:30px;
border-radius:4px;
flex:0 0 auto;
}


.author .name{
font-weight:600;
line-height:1;
}


.author + .author{margin-left:6px;position:relative}
.author + .author::before{
content:"";
position:absolute;
left:-4px;
top:10%;
bottom:10%;
width:1px;
border-radius:1px;
/* no background color set to avoid theme conflict */
}


.avatar{
width:28px;
height:28px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}


.affiliation {
    display: block !important;
}

@media (max-width:560px){
.author-line{white-space:normal;flex-wrap:wrap;gap:4px}
.author{padding:4px 6px}
.author + .author::before{display:none}
}
/* =========================================================
   OJS Submission Compatibility Fix
   ========================================================= */

/* Ensure all submission fields remain visible */
input[name="affiliation"],
#affiliation,
.cmp_form input,
.cmp_form select,
.cmp_form textarea {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Never hide affiliation fields */
.affiliation,
.item.affiliation,
.author .affiliation {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Keep required fields focusable */
input:required,
select:required,
textarea:required {
    display: block !important;
    visibility: visible !important;
}
/* =========================================================
   UNIVERSAL TYPOGRAPHY (TIMES NEW ROMAN + JUSTIFIED TEXT)
   ========================================================= */

/* Apply Times New Roman to the entire website */
html,
body,
div,
section,
article,
main,
aside,
header,
footer,
nav,
h1, h2, h3, h4, h5, h6,
p,
span,
a,
li,
ul,
ol,
td,
th,
label,
input,
select,
textarea,
button,
blockquote,
caption,
figcaption,
small,
strong,
em {
    font-family: "Times New Roman", Times, serif !important;
}

/* Justify all paragraphs */
p {
    text-align: justify !important;
    text-justify: inter-word;
    line-height: 1.7 !important;
    font-size: 16px !important;
    margin-bottom: 12px;
}

/* Lists */
li {
    text-align: justify !important;
    line-height: 1.7 !important;
    font-size: 16px !important;
}

/* Article Pages */
.obj_article_details,
.obj_article_details p,
.obj_article_details li,
.obj_article_details span,
.article-details,
.article-details p,
.article-details li,
.article-details span,
.abstract,
.abstract p,
.abstract li {
    font-family: "Times New Roman", Times, serif !important;
    text-align: justify !important;
    text-justify: inter-word;
    line-height: 1.7 !important;
    font-size: 16px !important;
}

/* Static Pages (About, Policies, Editorial Team, etc.) */
.pkp_structure_main,
.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_main span,
.page p,
.page li,
.about_section p,
.about_section li {
    font-family: "Times New Roman", Times, serif !important;
    text-align: justify !important;
    text-justify: inter-word;
    line-height: 1.7 !important;
    font-size: 16px !important;
}

/* Tables */
table,
td,
th {
    font-family: "Times New Roman", Times, serif !important;
    font-size: 16px !important;
}

/* Navigation */
.pkp_navigation_primary a,
.pkp_navigation_user a {
    font-family: "Times New Roman", Times, serif !important;
}

/* Footer */
.pkp_footer_content,
.pkp_footer_content p,
.pkp_footer_content a {
    font-family: "Times New Roman", Times, serif !important;
}
.article-details .published {
    display: none !important;
}

.article-details .item.published {
    display: none !important;
}

.article-summary .published {
    display: none !important;
}
/* Hide publication date everywhere */
.item.published,
.published,
.datePublished,
.article-details-date,
.obj_article_details .published,
.obj_article_details .item.published,
.obj_article_details .date,
.obj_article_details .item.datePublished,
.article_meta .published,
.article_meta .item,
.cmp_article_details .published,
.cmp_article_details .item.published,
.cmp_article_details .datePublished,
.page_article .published,
.page_article .item.published,
.page_article time,
.obj_article_details time {
    display: none !important;
}

/* =========================================================
   ★ ADDITIONAL FIXES
   NOTE: Header banner photo, header layout, and journal name
   are NOT touched anywhere in this block.
   Covers:
   1. Sidebar pulled fully flush to the right (closes the gap)
   2. All borders removed on every page
   ========================================================= */

/* 1. SIDEBAR — CLOSE THE RIGHT-SIDE GAP, KEEP IT FLUSH RIGHT */
.pkp_structure_page {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.pkp_structure_content {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.pkp_structure_main {
    order: 1 !important;
    float: none !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

.pkp_structure_sidebar {
    order: 2 !important;
    float: none !important;
    flex: 0 0 auto !important;
    margin-left: 24px !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
}

/* 2. REMOVE BORDERS EVERYWHERE, ON ALL PAGES */
.pkp_structure_main,
.pkp_structure_page,
.pkp_structure_content,
.pkp_structure_footer_wrapper,
.page,
.container,
main,
section,
article,
.obj_article_details,
.obj_issue_toc,
.obj_issue_summary {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* =========================================================
   ★ ADDITIONAL FIXES ROUND 2
   1. Remove the thin grey vertical divider line (columns)
   2. More left-side breathing room for main content
   ========================================================= */

.pkp_structure_main,
.pkp_structure_main *,
.page,
.page *,
.value,
.description,
.cmp_richtext {
    column-count: 1 !important;
    columns: auto !important;
    column-rule: none !important;
    -webkit-column-rule: none !important;
    -moz-column-rule: none !important;
}

.pkp_structure_content {
    padding: 0 30px !important;
}

.pkp_structure_main {
    padding: 25px 30px 25px 40px !important;
    box-sizing: border-box !important;
}

/* =========================================================
   ★ RESTORED FIXES
   ========================================================= */

/* Push main content in from the left edge */
.pkp_structure_main {
    padding: 25px 30px 25px 70px !important;
}

/* Fix any sidebar video iframe collapsing to a thin sliver */
iframe {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    border: none !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* =========================================================
   ★ DROPDOWN MENU COLORS — Golden + Dark Green
   ========================================================= */
.pkp_navigation_primary .has_submenu .submenu,
.pkp_navigation_primary ul ul,
.pkp_navigation_primary .dropdown-menu,
.dropdown-menu,
.pkp_navigation_user .submenu {
    background: linear-gradient(180deg, #d4af37 0%, #234b36 100%) !important;
    border: 1px solid #d4af37 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25) !important;
}

.pkp_navigation_primary .has_submenu .submenu a,
.pkp_navigation_primary ul ul a,
.pkp_navigation_primary .dropdown-menu a,
.dropdown-menu a,
.pkp_navigation_user .submenu a {
    color: #ffffff !important;
    background: transparent !important;
}

.pkp_navigation_primary .has_submenu .submenu a:hover,
.pkp_navigation_primary ul ul a:hover,
.pkp_navigation_primary .dropdown-menu a:hover,
.dropdown-menu a:hover,
.pkp_navigation_user .submenu a:hover {
    background: #163d2e !important;
    color: #ffe08a !important;
}

/* =========================================================
   ★ PROFESSIONAL TITLES — remove border lines above/below
   headings and article/issue titles, all pages
   ========================================================= */
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4,
.page_title,
.obj_issue_toc .title,
.obj_issue_toc .title a,
.obj_article_details .page_title,
.article_title,
.cmp_article_details .title {
    border-top: none !important;
    border-bottom: none !important;
    text-decoration: none !important;
    box-shadow: none !important;
    padding-bottom: 6px !important;
    margin-bottom: 14px !important;
}

/* =========================================================
   ★ GREY LINE — TARGETED FIX
   ========================================================= */
.pkp_structure_main .value,
.pkp_structure_main .value *,
.pkp_structure_main .description,
.pkp_structure_main .description *,
.pkp_structure_main p,
.pkp_structure_main div,
.pkp_structure_main span {
    border-left: none !important;
    border-right: none !important;
    -webkit-column-rule: none !important;
    column-rule: none !important;
}

/* =========================================================
   ★ HERO BANNER — SAME PICTURE ON EVERY PAGE
   The banner picture (your OJS Homepage Image) is used as the
   background of the 400px banner area on ALL pages. The journal
   name rows sit on top, the navigation strip is directly below.
   The old header picture and the in-content copy are hidden.
   ========================================================= */
.pkp_head_wrapper,
.pkp_site_name_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Header */
.pkp_structure_head {
    position: relative !important;
    z-index: 5 !important;
    overflow: visible !important;
    min-height: 0 !important;
    height: auto !important;
    background: transparent !important;
}

/* The Homepage Image inside the page content is hidden (it is now the banner above) */
.homepage_image {
    display: none !important;
}

/* ---------------------------------------------------------
   BANNER PICTURE ADDRESS (one place only) — your OJS Homepage
   Image. If you upload a new one, change the address here.
   --------------------------------------------------------- */
:root {
    --hero-banner-image: url("https://alamin.tuf.edu.pk/public/journals/1/homepageImage_en.png");
}

/* Banner area of the header: 400px on every page, picture as
   background (dark green shows if the picture is not loaded) */
.pkp_structure_head .pkp_site_name {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 400px !important;
    min-height: 400px !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #163d2e !important;
    background-image: var(--hero-banner-image), linear-gradient(135deg, #163d2e, #234b36, #163d2e) !important;
    background-size: cover, cover !important;
    background-position: center, center !important;
    background-repeat: no-repeat, no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

/* The link fills the banner area; the name rows are centered in it */
.pkp_structure_head .pkp_site_name > a {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Old header picture: hidden */
.pkp_structure_head .pkp_site_name img,
.pkp_structure_head .pkp_site_name > a img {
    display: none !important;
}

.nav-search-wrapper,
.pkp_navigation_primary {
    position: relative !important;
    z-index: 5 !important;
    clear: both !important;
    margin-top: 0 !important;
}

/* =========================================================
   ★ ISSUE ARCHIVE — GOLD LINE BETWEEN ISSUES
   Covers the different markup OJS 3.4 themes use to list
   issues, so the line shows up regardless of theme structure.
   ========================================================= */
.obj_issue_summary,
.issues_archive .obj_issue_summary,
.issues_archive li,
.issues_archive .item,
li.pkp_issue,
.pkp_issue,
.page_issue_archive .obj_issue_summary,
.page_issue_archive li {
    border-bottom: 2px solid #d4af37 !important;
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
}

/* Remove the line after the very last issue in the list */
.obj_issue_summary:last-child,
.issues_archive .obj_issue_summary:last-child,
.issues_archive li:last-child,
.issues_archive .item:last-child,
li.pkp_issue:last-child,
.pkp_issue:last-child,
.page_issue_archive .obj_issue_summary:last-child,
.page_issue_archive li:last-child {
    border-bottom: none !important;
}

/* =========================================================
   ★ FINAL FIX — KILL THE GREY VERTICAL DIVIDER LINE
   ========================================================= */
* {
    column-rule: none !important;
    -webkit-column-rule: none !important;
    -moz-column-rule: none !important;
}

.pkp_structure_content,
.pkp_structure_main {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_main::before,
.pkp_structure_main::after {
    display: none !important;
    content: none !important;
    border: none !important;
    background: none !important;
}

/* =========================================================
   ★ NAV — full-width strip directly under the banner; menu
   links and Search share ONE row (as in OK_OK)
   ========================================================= */
.pkp_site_nav_menu {
    position: relative !important;
    margin-top: 0 !important;
    width: 100% !important;
    z-index: 10 !important;
}

.pkp_navigation_primary_row {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_navigation_primary_wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 30px !important;
    box-sizing: border-box !important;
}

.pkp_navigation_primary_wrapper .pkp_navigation_primary {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

.pkp_navigation_primary_wrapper .pkp_navigation_search_wrapper {
    flex: 0 0 auto !important;
    float: none !important;
    margin: 0 0 0 15px !important;
}

/* =========================================================
   ★ ACCOUNT BADGE — fixed top-right corner pill
   ========================================================= */
.nav-search-wrapper {
    flex-wrap: nowrap !important;
}

.pkp_navigation_user_wrapper.pkp_navigation_user_wrapper {
    position: fixed !important;
    top: 0 !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: fit-content !important;
    min-width: 0 !important;
    height: auto !important;
    float: none !important;
    display: inline-flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    z-index: 9999 !important;
    box-sizing: border-box !important;
}

.pkp_navigation_user_wrapper.pkp_navigation_user_wrapper a,
.pkp_navigation_user_wrapper.pkp_navigation_user_wrapper .profile > a {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: fit-content !important;
    white-space: nowrap !important;
    padding: 6px 16px !important;
    background: #163d2e !important; /* solid dark green */
    border: 1px solid #d4af37 !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.4) !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
}

.pkp_navigation_user_wrapper a,
.pkp_navigation_user a {
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    text-decoration: none !important;
    text-shadow: none !important;
}

.pkp_navigation_user_wrapper a:hover,
.pkp_navigation_user a:hover {
    color: #ffffff !important;
}

/* Let dropdown menus render in full below the header */
.pkp_structure_head {
    overflow: visible !important;
}

/* Hide the small dropdown arrow/caret icons */
.pkp_navigation_primary a::after,
.pkp_navigation_user a::after,
.profile > a::after,
.has_submenu > a::after {
    display: none !important;
    content: none !important;
}

/* Hide the unstyled icon box in the search pill */
.pkp_search .fa,
.pkp_search .fa-search,
.pkp_navigation_search_wrapper .fa,
.pkp_navigation_search_wrapper .fa-search {
    display: none !important;
}

.pkp_search {
    justify-content: center !important;
}


/* =========================================================
   PROFESSIONAL JOURNAL NAVIGATION STRIP
   Theme: Light Green + Dark Green + Antique Gold
   ========================================================= */

.nav-search-wrapper {
    background: linear-gradient(90deg, #163d2e 0%, #234b36 45%, #163d2e 100%) !important;
    border-top: 1px solid rgba(212,175,55,0.65) !important;
    border-bottom: 2px solid #d4af37 !important;
    box-shadow: 0 3px 10px rgba(22,61,46,0.22) !important;
}

.pkp_navigation_primary a {
    color: #f4f9ea !important;
    background: transparent !important;
    border-left: 1px solid rgba(212,175,55,0.18);
    padding-left: 20px !important;
    padding-right: 20px !important;
    transition: background-color 0.25s ease, color 0.25s ease !important;
}

.pkp_navigation_primary a:hover,
.pkp_navigation_primary li:hover > a {
    background: linear-gradient(180deg, #d4af37, #b88924) !important;
    color: #163d2e !important;
    text-shadow: none !important;
}

.pkp_navigation_primary li:first-child > a {
    border-left: none !important;
}

.pkp_navigation_user a {
    color: #f4f9ea !important;
}

/* Search area integrated into the journal strip */
.pkp_search {
    background: #dbe8cc !important;
    border: 1px solid #d4af37 !important;
    box-shadow: 0 2px 7px rgba(22,61,46,0.22) !important;
}

.pkp_search input[type="text"],
.pkp_search input[type="search"] {
    color: #163d2e !important;
}

.pkp_search button {
    background: #234b36 !important;
    color: #f4f9ea !important;
    border: 1px solid #d4af37 !important;
}

.pkp_search button:hover {
    background: #d4af37 !important;
    color: #163d2e !important;
}

/* Professional dropdown treatment */
.pkp_navigation_primary .has_submenu .submenu,
.pkp_navigation_primary ul ul,
.pkp_navigation_primary .dropdown-menu,
.dropdown-menu,
.pkp_navigation_user .submenu {
    background: linear-gradient(180deg, #eef5e1 0%, #a9c797 100%) !important;
    border: 1px solid #d4af37 !important;
    box-shadow: 0 6px 16px rgba(22,61,46,0.28) !important;
}

.pkp_navigation_primary .has_submenu .submenu a,
.pkp_navigation_primary ul ul a,
.pkp_navigation_primary .dropdown-menu a,
.dropdown-menu a,
.pkp_navigation_user .submenu a {
    color: #163d2e !important;
    border-left: none !important;
}

.pkp_navigation_primary .has_submenu .submenu a:hover,
.pkp_navigation_primary ul ul a:hover,
.pkp_navigation_primary .dropdown-menu a:hover,
.dropdown-menu a:hover,
.pkp_navigation_user .submenu a:hover {
    background: #234b36 !important;
    color: #ffe8a3 !important;
}


/* =========================================================
   FINAL NAVIGATION POLISH
   Light green strip, dark green text, gold accents.
   ========================================================= */

.nav-search-wrapper,
.pkp_site_nav_menu {
    background: linear-gradient(
        180deg,
        #e9f2dd 0%,
        #d3e4c3 48%,
        #bcd4aa 100%
    ) !important;
    border-top: 1px solid #f4e6ad !important;
    border-bottom: 3px solid #234b36 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.55),
                0 3px 10px rgba(22,61,46,0.22) !important;
}

/* Use the full navigation width */
.pkp_navigation_primary {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: space-evenly !important;
    align-items: stretch !important;
}

.pkp_navigation_primary > li {
    flex: 1 1 auto !important;
    text-align: center !important;
    margin: 0 !important;
}

.pkp_navigation_primary a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #163d2e !important;
    background: transparent !important;
    border-left: 1px solid rgba(35,75,54,0.22) !important;
    border-bottom: 3px solid transparent !important;
    text-shadow: none !important;
    font-weight: 700 !important;
    padding: 14px 12px !important;
}

.pkp_navigation_primary > li:first-child > a {
    border-left: none !important;
}

.pkp_navigation_primary a:hover,
.pkp_navigation_primary li:hover > a {
    background: linear-gradient(
        180deg,
        #f6efc8 0%,
        #e0c46a 100%
    ) !important;
    color: #163d2e !important;
    border-bottom-color: #234b36 !important;
    box-shadow: inset 0 -2px 0 #d4af37 !important;
}

/* Keep the search visually integrated with the strip */
.pkp_search {
    background: #f1f7e6 !important;
    border: 1px solid #b8860b !important;
    box-shadow: 0 2px 8px rgba(22,61,46,0.20) !important;
}

.pkp_search input[type="text"],
.pkp_search input[type="search"] {
    color: #163d2e !important;
}

.pkp_search input::placeholder {
    color: #4f6b55 !important;
}

.pkp_search button {
    background: #234b36 !important;
    color: #f4f9ea !important;
    border-color: #d4af37 !important;
}

.pkp_search button:hover {
    background: #b8860b !important;
    color: #163d2e !important;
}

/* Coordinated account badge */
.pkp_navigation_user_wrapper.pkp_navigation_user_wrapper a {
    background: #234b36 !important;
    border-color: #d4af37 !important;
    color: #f4f9ea !important;
}


/* =========================================================
   SEARCH LINK TEXT — same in every state (dark green on the
   light green strip; replaces the old white-search rules)
   ========================================================= */
.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper a span,
.pkp_navigation_search_wrapper a:link,
.pkp_navigation_search_wrapper a:visited,
.pkp_navigation_search_wrapper a:active,
.pkp_navigation_search_wrapper a:hover,
.pkp_navigation_search_wrapper a:focus {
    color: #163d2e !important;
    -webkit-text-fill-color: #163d2e !important;
}

.pkp_navigation_search_wrapper a svg,
.pkp_navigation_search_wrapper a svg *,
.pkp_navigation_search_wrapper a .fa,
.pkp_navigation_search_wrapper a .fas,
.pkp_navigation_search_wrapper a .fa-search {
    color: #163d2e !important;
    fill: #163d2e !important;
    stroke: #163d2e !important;
}

/* =========================================================
   AL-AMĪN JOURNAL NAME — OK_OK style bar (dark green, gold
   border) centered over the banner picture, in TWO ROWS:
   row 1 = name, row 2 = subtitle. Text is unchanged.
   ========================================================= */
.pkp_site_name::before,
.pkp_site_name::after {
    display: none !important;
    content: none !important;
}

/* Row 1 — journal name (top half of the bar) */
.pkp_site_name > a::before {
    content: "Al-Amīn الامین (Faiṣalābād)" !important;
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 780px !important;
    max-width: 90% !important;
    margin: 0 auto !important;
    padding: 16px 30px 2px !important;
    background: linear-gradient(135deg, rgba(22,61,46,0.97), rgba(35,75,54,0.95), rgba(22,61,46,0.97)) !important;
    border: 2px solid #d4af37 !important;
    border-bottom: none !important;
    border-radius: 6px 6px 0 0 !important;
    box-shadow: 0 -4px 14px rgba(22,61,46,0.25) !important;
    color: #fffdf5 !important;
    -webkit-text-fill-color: #fffdf5 !important;
    font-family: "Times New Roman", Times, serif !important;
    font-size: 37px !important;
    font-weight: 700 !important;
    font-style: normal !important;
    line-height: 1.25 !important;
    letter-spacing: 0.15px !important;
    white-space: nowrap !important;
    text-align: center !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.28) !important;
}

/* Row 2 — subtitle (bottom half of the bar) + small gold line */
.pkp_site_name > a::after {
    content: "A Research Journal of Islamic & Social Sciences" !important;
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 780px !important;
    max-width: 90% !important;
    margin: 0 auto !important;
    padding: 4px 30px 34px !important;
    background-color: transparent !important;
    background-image:
        linear-gradient(#d4af37, #d4af37),
        linear-gradient(135deg, rgba(22,61,46,0.97), rgba(35,75,54,0.95), rgba(22,61,46,0.97)) !important;
    background-repeat: no-repeat !important;
    background-position: center bottom 14px, center !important;
    background-size: 92px 2px, 100% 100% !important;
    border: 2px solid #d4af37 !important;
    border-top: none !important;
    border-radius: 0 0 6px 6px !important;
    box-shadow: 0 4px 14px rgba(22,61,46,0.35) !important;
    color: #efe6c0 !important;
    -webkit-text-fill-color: #efe6c0 !important;
    font-family: "Times New Roman", Times, serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: 1.4 !important;
    letter-spacing: 0.15px !important;
    white-space: nowrap !important;
    text-align: center !important;
    text-shadow: none !important;
}

@media (max-width: 768px) {
    .pkp_site_name > a::before { font-size: 29px !important; }
    .pkp_site_name > a::after  { font-size: 15px !important; }
    .pkp_navigation_primary_wrapper { padding: 0 12px !important; }
}

@media (max-width: 480px) {
    .pkp_site_name > a::before { font-size: 20px !important; line-height: 1.3 !important; padding: 12px 12px 2px !important; }
    .pkp_site_name > a::after  { font-size: 12px !important; padding: 4px 12px 28px !important; background-size: 65px 2px, 100% 100% !important; }
}

/* =========================================================
   HIDE DOI FROM PREVIOUS 6 ISSUES ONLY (Issue IDs 2–7)
   Volume 4 Issue 1 (2026) = Issue ID 8 keeps its DOI.
   Future issues remain unaffected.
   ========================================================= */
.obj_article_details:has(.item.issue a[href*="/issue/view/2"]) .doi,
.obj_article_details:has(.item.issue a[href*="/issue/view/3"]) .doi,
.obj_article_details:has(.item.issue a[href*="/issue/view/4"]) .doi,
.obj_article_details:has(.item.issue a[href*="/issue/view/5"]) .doi,
.obj_article_details:has(.item.issue a[href*="/issue/view/6"]) .doi,
.obj_article_details:has(.item.issue a[href*="/issue/view/7"]) .doi {
    display: none !important;
}