body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url('https://ijil.uinkhas.ac.id/public/site/batik.png'); background-size: auto; background-position: top left; background-repeat: repeat; background-attachment: fixed; z-index: -2; } body::after { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0); z-index: -1; } /* Ensure body background doesn't interfere with background image */ body { background: transparent !important; } /* Mobile fix for background attachment */ @media (max-width: 768px) { body::before { background-attachment: scroll; } } /* Content frame styling */ .pkp_structure_content, /* .pkp_structure_main, */ .obj_article_summary, .article-summary, .article-details, .cmp_announcements, .issue_toc, .publication_abstract, .item_abstract { box-shadow: 2px; border-radius: 10px; padding: 6px; } /* Tab active styling */ .pkp_tab.active > a, .pkp_tab.active > a span, .pkp_structure_content > a, .pkp_structure_main > a, .article-details > a, .obj_article_summary > a, .article-summary > a, .pkp_navigation_primary > a, .tabs .active > a, .tabs .active > a span, .nav-tabs .active > a, .nav-tabs .active > a span, .nav-tabs .active > a:hover, .nav-tabs .active > a:hover span, .ui-tabs-active > a, .ui-tabs-active > a span, .ui-state-active > a, .ui-state-active > a span, .ui-tabs-active > a:hover, .ui-tabs-active > a:hover span, .ui-state-active > a:hover, .ui-state-active > a:hover span { background-color: #073201 !important; color: #06FF42 !important; } /* Define CSS Variables with high specificity */ :root, :root[data-theme], html, html[data-theme] { --bg-base: #025028 !important; --tab-active-background-color: #073201 !important; --tab-active-font-color: #06FF42 !important; --tab-inactive-font-color: #000000 !important; } /* Ensure hover effect uses the correct color with !important */ .hvr-sweep-to-right:before { background: var(--bg-base) !important; background-color: var(--bg-base) !important; } /* Override any existing hover.min.css variables */ [class*='hvr-'] { --bg-base: #025028 !important; } /* Direct color override as fallback */ .hvr-sweep-to-right:before { background: #025028 !important; background-color: #025028 !important; } /* Targeted hover font color - Only apply when directly hovering over interactive elements */ a:hover, a:focus, a:hover *, a:focus *, .pkp_structure_content a:hover, .pkp_structure_content a:focus, .pkp_structure_content a:hover *, .pkp_structure_content a:focus *, .pkp_structure_main a:hover, .pkp_structure_main a:focus, .pkp_structure_main a:hover *, .pkp_structure_main a:focus *, .pkp_navigation_primary a:hover, .pkp_navigation_primary a:focus, .pkp_navigation_primary a:hover *, .pkp_navigation_primary a:focus *, .pkp_navigation_primary_row a:hover, .pkp_navigation_primary_row a:focus, .pkp_navigation_primary_row a:hover *, .pkp_navigation_primary_row a:focus *, .main-navigation a:hover, .main-navigation a:focus, .main-navigation a:hover *, .main-navigation a:focus *, .navbar-nav a:hover, .navbar-nav a:focus, .navbar-nav a:hover *, .navbar-nav a:focus *, .nav-link:hover, .nav-link:focus, .nav-link:hover *, .nav-link:focus *, .btn:hover, .btn:focus, .btn:hover *, .btn:focus *, button:hover, button:focus, button:hover *, button:focus *, input:hover[type='submit'], input:focus[type='submit'], input:hover[type='submit'] *, input:focus[type='submit'] *, input:hover[type='button'], input:focus[type='button'], input:hover[type='button'] *, input:focus[type='button'] *, .pkp_button:hover, .pkp_button:focus, .pkp_button:hover *, .pkp_button:focus *, .article-details a:hover, .article-details a:focus, .article-details a:hover *, .article-details a:focus *, .article-summary a:hover, .article-summary a:focus, .article-summary a:hover *, .article-summary a:focus *, .obj_article_summary a:hover, .obj_article_summary a:focus, .obj_article_summary a:hover *, .obj_article_summary a:focus *, .cmp_breadcrumbs a:hover, .cmp_breadcrumbs a:focus, .cmp_breadcrumbs a:hover *, .cmp_breadcrumbs a:focus *, .breadcrumb a:hover, .breadcrumb a:focus, .breadcrumb a:hover *, .breadcrumb a:focus *, .pkp_breadcrumb a:hover, .pkp_breadcrumb a:focus, .pkp_breadcrumb a:hover *, .pkp_breadcrumb a:focus * { color: #00FF0D !important; text-decoration: none !important; transition: color 0.3s ease !important; } /* Target semua elemen link secara langsung saat di-hover */ a:hover, a:focus, a:hover *, a:focus *, .pkp_structure_content a:hover, .pkp_structure_content a:focus, .pkp_structure_content a:hover *, .pkp_structure_content a:focus *, .pkp_structure_main a:hover, .pkp_structure_main a:focus, .pkp_structure_main a:hover *, .pkp_structure_main a:focus *, .pkp_navigation_primary a:hover, .pkp_navigation_primary a:focus, .pkp_navigation_primary a:hover *, .pkp_navigation_primary a:focus *, .pkp_navigation_primary_row a:hover, .pkp_navigation_primary_row a:focus, .pkp_navigation_primary_row a:hover *, .pkp_navigation_primary_row a:focus *, .main-navigation a:hover, .main-navigation a:focus, .main-navigation a:hover *, .main-navigation a:focus *, .navbar-nav a:hover, .navbar-nav a:focus, .navbar-nav a:hover *, .navbar-nav a:focus *, .nav-link:hover, .nav-link:focus, .nav-link:hover *, .nav-link:focus *, .btn:hover, .btn:focus, .btn:hover *, .btn:focus *, button:hover, button:focus, button:hover *, button:focus *, input:hover[type='submit'], input:focus[type='submit'], input:hover[type='submit'] *, input:focus[type='submit'] *, input:hover[type='button'], input:focus[type='button'], input:hover[type='button'] *, input:focus[type='button'] *, .pkp_button:hover, .pkp_button:focus, .pkp_button:hover *, .pkp_button:focus *, .article-details a:hover, .article-details a:focus, .article-details a:hover *, .article-details a:focus *, .article-summary a:hover, .article-summary a:focus, .article-summary a:hover *, .article-summary a:focus *, .obj_article_summary a:hover, .obj_article_summary a:focus, .obj_article_summary a:hover *, .obj_article_summary a:focus *, .cmp_breadcrumbs a:hover, .cmp_breadcrumbs a:focus, .cmp_breadcrumbs a:hover *, .cmp_breadcrumbs a:focus *, .breadcrumb a:hover, .breadcrumb a:focus, .breadcrumb a:hover *, .breadcrumb a:focus *, .pkp_breadcrumb a:hover, .pkp_breadcrumb a:focus, .pkp_breadcrumb a:hover *, .pkp_breadcrumb a:focus * { color: #00FF0D !important; text-decoration: none !important; transition: color 0.3s ease !important; } /* Target khusus untuk navigasi dan menu */ .pkp_navigation_primary li:hover > a, .pkp_navigation_primary li:hover > a *, .pkp_navigation_primary li:focus > a, .pkp_navigation_primary li:focus > a *, .pkp_navigation_primary_row li:hover > a, .pkp_navigation_primary_row li:hover > a *, .pkp_navigation_primary_row li:focus > a, .pkp_navigation_primary_row li:focus > a *, .main-navigation li:hover > a, .main-navigation li:hover > a *, .main-navigation li:focus > a, .main-navigation li:focus > a *, .navbar-nav li:hover > a, .navbar-nav li:hover > a *, .navbar-nav li:focus > a, .navbar-nav li:focus > a * { color: #00FF0D !important; } /* Override inline styles dan stylesheets tema */ body a:hover, body a:focus, body a:hover *, body a:focus *, html a:hover, html a:focus, html a:hover *, html a:focus *, .pkp_structure_head a:hover, .pkp_structure_head a:focus, .pkp_structure_head a:hover *, .pkp_structure_head a:focus *, .pkp_navigation_primary a:hover, .pkp_navigation_primary a:focus, .pkp_navigation_primary a:hover *, .pkp_navigation_primary a:focus *, .pkp_structure_content a:hover, .pkp_structure_content a:focus, .pkp_structure_content a:hover *, .pkp_structure_content a:focus * { color: #00FF0D !important; } /* Header & Navigation */ .pkp_structure_head, .pkp_navigation_primary, .pkp_navigation_primary_row, .pkp_site_name, .header_warna { background-color: !important; background: !important; } /* Buttons */ .pkp_button_primary, .btn-primary, button.pkp_button, .button.primary, input[type='submit'].primary { background-color: !important; border-color: !important; } /* Links & Navigation Items */ .pkp_navigation_primary a, .pkp_navigation_primary_row a, .main-navigation a { color: white !important; } /* Active states */ .pkp_navigation_primary a:hover, .pkp_navigation_primary_row a:hover { background-color: #00 !important; } /* Base background color for active tabs */ .pkp_tab.active > a, .pkp_tab.active > a span, .tabs .active > a, .tabs .active > a span, .nav-tabs .active > a, .nav-tabs .active > a span, .nav-tabs .active > a:hover, .nav-tabs .active > a:hover span, .ui-tabs-active > a, .ui-tabs-active > a span, .ui-state-active > a, .ui-state-active > a span, .ui-tabs-active > a:hover, .ui-tabs-active > a:hover span, .ui-state-active > a:hover, .ui-state-active > a:hover span { background-color: #073201 !important; color: #06FF42 !important; } /* Site logo/title */ .pkp_site_name a { color: white !important; } /* Breadcrumbs & pagination */ .current_issue .current, .pagination .current, .pkp_pagination .current { background-color: !important; border-color: !important; } body, .pkp_structure_main, .pkp_structure_content, .pkp_structure_content p, .pkp_structure_content div, .pkp_structure_content span, .article-details, .article-summary, .obj_article_summary, .article-full-text { color: #000000 !important; } /* Headings */ h1, h2, h3, h4, h5, h6, .pkp_structure_content h1, .pkp_structure_content h2, .pkp_structure_content h3, .pkp_structure_content h4, .pkp_structure_content h5, .pkp_structure_content h6 { color: #000000 !important; } a, a:link, a:visited, .pkp_structure_content a, .pkp_structure_main a, .article-details a, .obj_article_summary a, .article-summary a, .pkp_navigation_primary a { text-decoration: none !important; transition: all 0.3s ease !important; } a:hover, .pkp_structure_content a:hover, .pkp_structure_main a:hover { color: #000000 !important; } body, html, .pkp_structure_page, .pkp_structure_content, .pkp_structure_main, .pkp_structure_sidebar, p, div, span, h1, h2, h3, h4, h5, h6, .article-details, .article-summary, .obj_article_summary, input, textarea, select, .btn, button { font-family: "Book Antiqua", "Palatino Linotype", Palatino, serif !important; } /* Fallback for system fonts */ @font-face { font-family: 'CustomFont'; src: local("Book Antiqua", "Palatino Linotype", Palatino, serif); font-display: swap; } body, .pkp_structure_content, .pkp_structure_main, .article-details, .article-summary, .obj_article_summary { font-size: 12px !important; line-height: 1.6 !important; } /* Responsive headings */ h1, .pkp_structure_content h1 { font-size: calc(12px * 2.5) !important; line-height: 1.2 !important; } h2, .pkp_structure_content h2 { font-size: calc(12px * 2) !important; line-height: 1.3 !important; } h3, .pkp_structure_content h3 { font-size: calc(12px * 1.75) !important; line-height: 0.8 !important; } h4, .pkp_structure_content h4 { font-size: calc(12px * 1.5) !important; line-height: 0.8 !important; } h5, .pkp_structure_content h5 { font-size: calc(12px * 1.25) !important; line-height: 1.5 !important; } h6, .pkp_structure_content h6 { font-size: calc(12px * 1.1) !important; line-height: 1.5 !important; } /* Mobile adjustments */ @media (max-width: 768px) { body, .pkp_structure_content { font-size: calc(12px * 0.9) !important; } h1 { font-size: calc(12px * 2) !important; } h2 { font-size: calc(12px * 1.8) !important; } h3 { font-size: calc(12px * 1.6) !important; } } .pkp_structure_head, .pkp_site_name, .header_warna, .pkp_head_wrapper { background-color: rgba(255,255,255,0.1) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; border-bottom: 1px solid rgba(255,255,255,0.2) !important; box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important; } .pkp_navigation_primary, .pkp_navigation_primary_row { background-color: transparent !important; background: transparent !important; } .pkp_site_name a { color: white !important; text-shadow: 2px 2px 4px rgba(0,0,0,0.5) !important; } .pkp_structure_page { max-width: 1200px !important; margin: 10px auto !important; box-shadow: 0 0 6px rgba(0, 0, 0, 0.3) !important; background: rgba(255,255,255,0.95) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; border-radius: 15px !important; overflow: hidden !important; border: 1px solid rgba(255,255,255,0.3) !important; } .pkp_structure_head { border-radius: 15px 15px 0 0 !important; background: rgba(255,255,255,0.1) !important; } .pkp_structure_content { padding: 6px !important; background: rgba(255,255,255,0.8) !important; } .obj_issue_toc .cover { float: left; width: 19% !important; height: auto; max-height: none; margin-right: 20px; } .pkp_structure_footer { background: rgba(255,255,255,0.1) !important; border-radius: 0 0 15px 15px !important; } /* Mobile adjustments */ @media (max-width: 768px) { .pkp_structure_page { margin: 5px !important; border-radius: 10px !important; background: rgba(255,255,255,0.98) !important; } .pkp_structure_content { padding: 15px !important; } } /* FORCE BREADCRUMB VISIBILITY AND STYLING - CRITICAL */ .cmp_breadcrumbs, .breadcrumb, .pkp_breadcrumb, .nav-breadcrumb { display: block !important; visibility: visible !important; opacity: 1 !important; font-size: 14px; color: #666; clear: both; width: 100%; position: relative; z-index: 10; } .cmp_breadcrumbs ol, .breadcrumb ol, .pkp_breadcrumb ol { display: block !important; visibility: visible !important; opacity: 1 !important; margin: 0; padding: 0; list-style: none; } /* Breadcrumb items styling with bgBaseColor */ .cmp_breadcrumbs ol li { display: inline-flex !important; background: #025028 !important; padding: 10px 10px 10px 23px !important; position: relative !important; margin: 0 10px 10px 0 !important; color: #fff !important; font-weight: bold !important; } /* Breadcrumb arrow styling with bgBaseColor */ .cmp_breadcrumbs ol li:after, .cmp_breadcrumbs ol li span:after { content: '' !important; border-top: 20px solid transparent !important; border-bottom: 20px solid transparent !important; border-left: 18px solid #025028 !important; position: absolute !important; right: -18px !important; top: 0 !important; z-index: 1 !important; } /* Current breadcrumb item with darker bgBaseColor */ .cmp_breadcrumbs ol li.current, .pkp_structure_content .cmp_breadcrumbs ol li.current, .pkp_structure_content span.current, .pkp_structure_main .cmp_breadcrumbs ol li.current { background: #025028 !important; color: #fff !important; font-weight: bold !important; position: relative !important; padding: 10px 10px 10px 23px !important; } .cmp_breadcrumbs ol li.current *, .pkp_structure_content .cmp_breadcrumbs ol li.current *, .pkp_structure_content .cmp_breadcrumbs ol li.current span { color: #fff !important; } .cmp_breadcrumbs .separator, .breadcrumb .separator { margin: 0 8px; color: #999; opacity: 0.7; } .cmp_breadcrumbs a, .breadcrumb a { color: #fff !important; text-decoration: none; } .cmp_breadcrumbs a:hover, .breadcrumb a:hover { color: #fff !important; text-decoration: none !important; } /* Override any theme hiding */ .container .cmp_breadcrumbs, .content .cmp_breadcrumbs, .main .cmp_breadcrumbs { display: block !important; visibility: visible !important; } /* Debug background to see if breadcrumb container exists */ .cmp_breadcrumbs { min-height: 20px !important; } /* Reset semua style footer terlebih dahulu */ .pkp_structure_footer_wrapper, .pkp_structure_footer, .footer, .pkp_footer, footer { background: none !important; background-color: transparent !important; background-image: none !important; } /* Terapkan background image dengan mode yang dipilih */ .pkp_structure_footer_wrapper { position: relative !important; background-image: url('https://ijil.uinkhas.ac.id/public/site/footer-bg.jpg') !important; background-size: auto !important; background-position: top left !important; background-repeat: repeat !important; } /* Style untuk overlay */ .pkp_structure_footer_wrapper::before { content: '' !important; display: block !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; background-color: rgba(0, 0, 0, 0.7) !important; z-index: 1 !important; } /* Pastikan konten footer di atas overlay */ .pkp_structure_footer { position: relative !important; z-index: 2 !important; background: transparent !important; } /* Hapus background color dari semua elemen footer */ .pkp_structure_footer, .footer, .pkp_footer, footer { background: transparent !important; background-color: transparent !important; } /* SUPER AGGRESSIVE - Override ALL hover effects for logo */ a.logo-no-hover, a.logo-no-hover:hover, a.logo-no-hover:focus, a.logo-no-hover:active, .pkp_structure_content a.logo-no-hover:hover, .pkp_structure_main a.logo-no-hover:hover { transition: none !important; transform: none !important; opacity: 1 !important; text-decoration: none !important; background: none !important; color: inherit !important; animation: none !important; } a.logo-no-hover img, a.logo-no-hover img:hover { transition: none !important; transform: none !important; opacity: 1 !important; animation: none !important; } /* Fix announcement read more icon - use FontAwesome */ .obj_announcement_summary .read_more { display: inline-block !important; position: relative !important; padding-right: 2.143rem !important; font-size: 0.93rem !important; font-weight: 700 !important; line-height: 2.143rem !important; color: #000000ff !important; text-decoration: none !important; } .obj_announcement_summary .read_more:after { display: inline-block !important; font: normal normal normal 14px / 1 FontAwesome !important; font-size: inherit !important; text-rendering: auto !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; transform: translate(0, 0) !important; line-height: unset !important; content: '\f054' !important; position: absolute !important; top: 3px !important; right: 5px !important; width: 30px !important; height: 30px !important; line-height: 30px !important; text-align: center !important; } .obj_announcement_summary .read_more:hover:after, .obj_announcement_summary .read_more:focus:after { transform: translateX(3px) !important; transition: all 0.3s ease !important; } .obj_announcement_summary .read_more:hover, .obj_announcement_summary .read_more:focus { color: #008acb !important; } /* Fix announcement date calendar icon - use FontAwesome */ .obj_announcement_summary .date:before { display: inline-block !important; font: normal normal normal 14px / 1 FontAwesome !important; font-size: inherit !important; text-rendering: auto !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; transform: translate(0, 0) !important; line-height: unset !important; content: '\f073' !important; margin-right: 0.5em !important; font-size: 14px !important; color: #000000 !important; } /* Force DOI container to align right */ .doi_container { display: flex !important; justify-content: flex-end !important; align-items: center !important; width: 100% !important; } .doi_container .ai-doi, .doi_container .doi_link { flex-shrink: 0 !important; } /* Grid container adjustment for DOI */ .sm\:grid-cols-12 .doi_container { justify-content: flex-end !important; } /* Mobile responsive */ @media (min-width: 640px) { .doi_container.sm\:flex { display: flex !important; justify-content: flex-end !important; } } .obj_article_summary, .obj_issue_summary, .article-summary, .article-details, .issue_toc { background-image: url('https://ijil.uinkhas.ac.id/public/site/ornament.jpg') !important; background-size: auto !important; background-repeat: repeat !important; background-position: top left !important; background-attachment: local !important; /* Add overlay for better text readability */ position: relative !important; box-shadow: 1px 1px 2px!important; border: 1px solid #00000024 !important; padding: 20px !important; border-radius: 10px !important; } .obj_article_summary::before, .obj_issue_summary::before, .article-summary::before, .article-details::before, .cmp_announcements::before, .issue_toc::before { content: '' !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; background: rgba(255, 255, 255, 0.3) !important; border-radius: 10px !important; z-index: 1 !important; } .obj_article_summary > *, .obj_issue_summary > *, .article-summary > *, .article-details > *, .cmp_announcements > *, .issue_toc > * { position: relative !important; z-index: 2 !important; } /* Content non-link font size */ .obj_article_summary, .article-summary, .article-details, .cmp_announcements, .issue_toc, .pkp_article_body, .article_body, .publication_abstract, .item_abstract, .obj_article_summary *, .article-summary *, .article-details *, .cmp_announcements *, .issue_toc *, .pkp_article_body *, .article_body *, .publication_abstract *, .item_abstract * { font-size: 13px !important; line-height: 1.6 !important; } /* Content link font size */ .obj_article_summary a, .article-summary a, .article-details a, .cmp_announcements a, .issue_toc a, .pkp_article_body a, .article_body a, .publication_abstract a, .item_abstract a { font-size: 16px !important; line-height: 1.3 !important; transition: all 0.3s ease !important; } /* Content link colors */ .obj_article_summary a, .article-summary a, .article-details a, .cmp_announcements a, .issue_toc a, .pkp_article_body a, .article_body a, .publication_abstract a, .item_abstract a { color: #070589 !important; text-decoration: none !important; line-height: 1.4 !important; padding-bottom: 1px !important; } /* Content link hover background colors */ .obj_article_summary a:hover, .article-summary a:hover, .article-details a:hover, .cmp_announcements a:hover, .issue_toc a:hover, .pkp_article_body a:hover, .article_body a:hover, .publication_abstract a:hover, .item_abstract a:hover { background-color: #003212 !important; color: #FFFFFF !important; padding: 4px 4px !important; border-radius: 6px !important; text-decoration: none !important; border-bottom: none !important; } /* Content link hover font colors */ .obj_article_summary a:hover, .article-summary a:hover, .article-details a:hover, .cmp_announcements a:hover, .issue_toc a:hover, .pkp_article_body a:hover, .article_body a:hover, .publication_abstract a:hover, .item_abstract a:hover { color: #FFFFFF !important; transition: color 0.3s ease !important; } .pkp_structure_footer, .pkp_structure_footer p, .pkp_structure_footer div, .pkp_structure_footer span, .pkp_structure_footer a, .pkp_structure_footer li, .pkp_structure_footer td, .footer, .footer p, .footer div, .footer span { color: #FFFFFF !important; } /* Footer headings */ .pkp_structure_footer h1, .pkp_structure_footer h2, .pkp_structure_footer h3, .pkp_structure_footer h4, .pkp_structure_footer h5, .pkp_structure_footer h6, .footer h1, .footer h2, .footer h3, .footer h4, .footer h5, .footer h6 { color: #FFFFFF !important; } .pkp_structure_footer a, .pkp_structure_footer a:link, .pkp_structure_footer a:visited, .footer a, .footer a:link, .footer a:visited { color: #04CF5C !important; text-decoration: none !important; transition: all 0.3s ease !important; } .pkp_structure_footer a:hover, .pkp_structure_footer a:focus, .footer a:hover, .footer a:focus { color: #2980b9 !important; transform: translateY(-1px) !important; opacity: 0.9 !important; } /* Footer navigation links with subtle background hover */ .pkp_structure_footer .pkp_navigation a, .footer .navigation a { padding: 5px 10px !important; border-radius: 3px !important; margin: 0 5px !important; } .pkp_structure_footer .pkp_navigation a:hover, .footer .navigation a:hover { background-color: rgba(255,255,255,0.1) !important; transform: translateY(-2px) !important; } .pkp_structure_footer, .pkp_structure_footer p, .pkp_structure_footer div, .pkp_structure_footer span, .pkp_structure_footer a, .pkp_structure_footer li, .pkp_structure_footer td, .pkp_structure_footer h1, .pkp_structure_footer h2, .pkp_structure_footer h3, .pkp_structure_footer h4, .pkp_structure_footer h5, .pkp_structure_footer h6, .footer, .footer * { font-family: "Book Antiqua", "Palatino Linotype", Palatino, serif !important; } .pkp_structure_footer, .pkp_structure_footer p, .pkp_structure_footer div, .pkp_structure_footer span, .pkp_structure_footer li, .pkp_structure_footer td, .footer, .footer p, .footer div, .footer span { font-size: 12px !important; line-height: 1.5 !important; } /* Footer headings scaling */ .pkp_structure_footer h1, .footer h1 { font-size: calc(12px * 2) !important; } .pkp_structure_footer h2, .footer h2 { font-size: calc(12px * 1.7) !important; } .pkp_structure_footer h3, .footer h3 { font-size: calc(12px * 1.5) !important; } .pkp_structure_footer h4, .footer h4 { font-size: calc(12px * 1.3) !important; } .pkp_structure_footer h5, .footer h5 { font-size: calc(12px * 1.2) !important; } .pkp_structure_footer h6, .footer h6 { font-size: calc(12px * 1.1) !important; } /* Footer links */ .pkp_structure_footer a, .footer a { font-size: 12px !important; } /* Mobile responsive for footer */ @media (max-width: 768px) { .pkp_structure_footer, .footer { font-size: calc(12px * 0.9) !important; padding: 20px 0 !important; } } /* Header background with higher specificity */ .pkp_structure_head, .pkp_site_name, .header_warna, .pkp_head_wrapper, .pkp_navigation_primary, .pkp_navigation_primary_row { background-color: #154F5A !important; background: #154F5A !important; } /* Override gradient and transparent styles if header background is set */ .pkp_structure_head { background-image: none !important; text-shadow: none !important; } /* Header description/tagline */ .pkp_site_name .description, .site-description, .journal-description { color: #FFFFFF !important; opacity: 0.9 !important; } /* Header text sizing */ .pkp_structure_head, .pkp_structure_head *, .header_warna, .header_warna * { font-size: 14px !important; } /* Site title scaling */ .pkp_site_name h1, .pkp_site_name .site-title, .journal-title { font-size: calc(14px * 1.8) !important; line-height: 1.2 !important; } /* Site description scaling */ .pkp_site_name .description, .site-description, .journal-description { font-size: calc(14px * 0.85) !important; line-height: 1.4 !important; } /* Navigation menu font size */ .pkp_navigation_primary, .pkp_navigation_primary *, .pkp_navigation_primary_row, .pkp_navigation_primary_row *, .main-navigation, .main-navigation * { font-size: 14px !important; } /* Mobile adjustments */ @media (max-width: 768px) { .pkp_site_name h1, .journal-title { font-size: calc(14px * 1.5) !important; } .pkp_structure_head, .pkp_navigation_primary { font-size: calc(14px * 0.9) !important; } } /* Navigation menu links */ .pkp_navigation_primary a, .pkp_navigation_primary_row a, .main-navigation a, .navbar-nav a, .nav-link { color: #FFFFFF !important; text-decoration: none !important; transition: all 0.3s ease !important; } /* Navigation menu items */ .pkp_navigation_primary li, .pkp_navigation_primary_row li, .main-navigation li { color: #FFFFFF !important; } /* Dropdown/Sub menu styling - SUPER AGGRESSIVE OVERRIDE for all possible OJS structures */ /* Standard dropdown classes */ .dropdown-menu, .sub-menu, .dropdown, /* OJS specific navigation dropdowns */ .pkp_navigation_primary .dropdown-menu, .pkp_navigation_primary_row .dropdown-menu, .pkp_navigation_primary .sub-menu, .pkp_navigation_primary_row .sub-menu, .main-navigation .dropdown-menu, .main-navigation .sub-menu, .pkp_navigation_primary ul ul, .pkp_navigation_primary_row ul ul, .main-navigation ul ul, .navbar-nav .dropdown-menu, .nav .dropdown-menu, .navigation .dropdown-menu, .pkp_navigation_primary li ul, .pkp_navigation_primary_row li ul, .main-navigation li ul, /* Header wrapper dropdowns */ .pkp_structure_head .dropdown-menu, .header_warga .dropdown-menu, .header_warna .dropdown-menu, .pkp_head_wrapper .dropdown-menu, .pkp_structure_head ul ul, .header_warga ul ul, .header_warna ul ul, .pkp_head_wrapper ul ul, /* Additional OJS structures */ .pkp_site_nav_menu .dropdown-menu, .pkp_site_nav_menu ul ul, .site-nav .dropdown-menu, .site-nav ul ul, /* Bootstrap and generic */ nav .dropdown-menu, nav ul ul, ul.dropdown-menu, ul.sub-menu, li ul.dropdown-menu, li ul.sub-menu, /* Nested structures */ .pkp_structure_head .pkp_navigation_primary ul ul, .pkp_structure_head .pkp_navigation_primary_row ul ul, .header_warna .pkp_navigation_primary ul ul, .header_warna .pkp_navigation_primary_row ul ul { background-color: #124751 !important; background: #124751 !important; border: 1px solid rgba(255,255,255,0.1) !important; box-shadow: 0 5px 15px rgba(0,0,0,0.2) !important; border-radius: 5px !important; z-index: 9999 !important; } /* Dropdown menu links - SUPER AGGRESSIVE OVERRIDE for all possible OJS structures */ /* Standard dropdown link classes */ .dropdown-menu a, .sub-menu a, .dropdown a, /* OJS specific navigation dropdown links */ .pkp_navigation_primary .dropdown-menu a, .pkp_navigation_primary_row .dropdown-menu a, .pkp_navigation_primary .sub-menu a, .pkp_navigation_primary_row .sub-menu a, .main-navigation .dropdown-menu a, .main-navigation .sub-menu a, .pkp_navigation_primary ul ul a, .pkp_navigation_primary_row ul ul a, .main-navigation ul ul a, .navbar-nav .dropdown-menu a, .nav .dropdown-menu a, .navigation .dropdown-menu a, .pkp_navigation_primary li ul a, .pkp_navigation_primary_row li ul a, .main-navigation li ul a, /* Header wrapper dropdown links */ .pkp_structure_head .dropdown-menu a, .header_warga .dropdown-menu a, .header_warna .dropdown-menu a, .pkp_head_wrapper .dropdown-menu a, .pkp_structure_head ul ul a, .header_warga ul ul a, .header_warna ul ul a, .pkp_head_wrapper ul ul a, /* Additional OJS structures */ .pkp_site_nav_menu .dropdown-menu a, .pkp_site_nav_menu ul ul a, .site-nav .dropdown-menu a, .site-nav ul ul a, /* Bootstrap and generic */ nav .dropdown-menu a, nav ul ul a, ul.dropdown-menu a, ul.sub-menu a, li ul.dropdown-menu a, li ul.sub-menu a, /* Nested structures */ .pkp_structure_head .pkp_navigation_primary ul ul a, .pkp_structure_head .pkp_navigation_primary_row ul ul a, .header_warna .pkp_navigation_primary ul ul a, .header_warna .pkp_navigation_primary_row ul ul a, /* List items in dropdowns */ .dropdown-menu li a, .sub-menu li a, ul ul li a, li ul li a { color: #FFFFFF !important; background: transparent !important; background-color: transparent !important; padding: 8px 15px !important; display: block !important; transition: all 0.3s ease !important; text-decoration: none !important; } /* Multi-level dropdown support with enhanced selectors */ .pkp_navigation_primary .dropdown-menu .dropdown-menu, .pkp_navigation_primary_row .dropdown-menu .dropdown-menu, .main-navigation .dropdown-menu .dropdown-menu, .pkp_navigation_primary ul ul ul, .pkp_navigation_primary_row ul ul ul, .main-navigation ul ul ul, .navbar-nav .dropdown-menu .dropdown-menu, .nav .dropdown-menu .dropdown-menu, /* Additional nested dropdowns */ .dropdown-menu .dropdown-menu, .sub-menu .sub-menu, ul ul ul, li ul ul { background-color: #103f48 !important; background: #103f48 !important; margin-top: -1px !important; margin-left: 100% !important; } /* Dropdown list items - ensure consistent background */ .dropdown-menu li, .sub-menu li, .pkp_navigation_primary ul ul li, .pkp_navigation_primary_row ul ul li, .main-navigation ul ul li, .navbar-nav .dropdown-menu li, .nav .dropdown-menu li, .navigation .dropdown-menu li, ul ul li, li ul li { background: transparent !important; background-color: transparent !important; border: none !important; } /* Dropdown hover states for list items */ .dropdown-menu li:hover, .sub-menu li:hover, .pkp_navigation_primary ul ul li:hover, .pkp_navigation_primary_row ul ul li:hover, .main-navigation ul ul li:hover, .navbar-nav .dropdown-menu li:hover, .nav .dropdown-menu li:hover, ul ul li:hover, li ul li:hover { background-color: #096539 !important; } /* Active/current menu item with enhanced selectors */ .pkp_navigation_primary .current a, .pkp_navigation_primary_row .current a, .pkp_navigation_primary .active a, .main-navigation .current-menu-item a, .pkp_navigation_primary .dropdown-menu .current a, .pkp_navigation_primary_row .dropdown-menu .current a, .pkp_navigation_primary ul ul .current a, .pkp_navigation_primary_row ul ul .current a, .main-navigation .dropdown-menu .current a, .navbar-nav .dropdown-menu .current a { color: #FFFFFF !important; font-weight: 600 !important; background-color: rgba(255,255,255,0.1) !important; } /* Universal dropdown override for any missed selectors */ .pkp_structure_head ul ul, .header_warna ul ul, .pkp_head_wrapper ul ul, nav ul ul, .navigation ul ul { background-color: #124751 !important; background: #124751 !important; } .pkp_structure_head ul ul a, .header_warna ul ul a, .pkp_head_wrapper ul ul a, nav ul ul a, .navigation ul ul a { color: #FFFFFF !important; background: transparent !important; } /* Navigation hover effects - main menu */ .pkp_navigation_primary a:hover, .pkp_navigation_primary_row a:hover, .pkp_navigation_primary li a:hover, .main-navigation a:hover, .navbar-nav a:hover, .nav-link:hover { color: #00FF3F !important; background-color: rgba(255,255,255,0.15) !important; border-radius: 4px !important; transform: translateY(-1px) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important; } /* Modern Dropdown Hover Effects - Enhanced Animation */ /* Add smooth transition for all dropdown links */ .dropdown-menu a, .sub-menu a, .dropdown a, .pkp_navigation_primary .dropdown-menu a, .pkp_navigation_primary_row .dropdown-menu a, .pkp_navigation_primary .sub-menu a, .pkp_navigation_primary_row .sub-menu a, .main-navigation .dropdown-menu a, .main-navigation .sub-menu a, .pkp_navigation_primary ul ul a, .pkp_navigation_primary_row ul ul a, .main-navigation ul ul a, .navbar-nav .dropdown-menu a, .nav .dropdown-menu a, .navigation .dropdown-menu a, .pkp_navigation_primary li ul a, .pkp_navigation_primary_row li ul a, .main-navigation li ul a, .pkp_structure_head .dropdown-menu a, .header_warga .dropdown-menu a, .header_warna .dropdown-menu a, .pkp_head_wrapper .dropdown-menu a { transition: all 0.35s cubic-bezier(0.4, 0.0, 0.2, 1) !important; position: relative !important; overflow: hidden !important; } /* Simple and clean dropdown link hover */ .dropdown-menu a:hover, .sub-menu a:hover, .dropdown a:hover, .pkp_navigation_primary .dropdown-menu a:hover, .pkp_navigation_primary_row .dropdown-menu a:hover, .pkp_navigation_primary .sub-menu a:hover, .pkp_navigation_primary_row .sub-menu a:hover, .main-navigation .dropdown-menu a:hover, .main-navigation .sub-menu a:hover, .pkp_navigation_primary ul ul a:hover, .pkp_navigation_primary_row ul ul a:hover, .main-navigation ul ul a:hover, .navbar-nav .dropdown-menu a:hover, .nav .dropdown-menu a:hover, .navigation .dropdown-menu a:hover { color: #00FF3F !important; background: rgba(255,255,255,0.15) !important; border-radius: 4px !important; transition: all 0.3s ease !important; } /* Simple Multi-level dropdown hover */ .pkp_navigation_primary .dropdown-menu .dropdown-menu a:hover, .pkp_navigation_primary_row .dropdown-menu .dropdown-menu a:hover, .pkp_navigation_primary ul ul ul a:hover, .pkp_navigation_primary_row ul ul ul a:hover, .main-navigation .dropdown-menu .dropdown-menu a:hover, .navbar-nav .dropdown-menu .dropdown-menu a:hover { background: rgba(255,255,255,0.2) !important; border-radius: 4px !important; } /* Simple Active item hover */ .pkp_navigation_primary .current a:hover, .pkp_navigation_primary_row .current a:hover, .main-navigation .current-menu-item a:hover, .pkp_navigation_primary .dropdown-menu .current a:hover, .pkp_navigation_primary_row .dropdown-menu .current a:hover { color: #00FF3F !important; background: rgba(255,255,255,0.2) !important; border-radius: 4px !important; } /* Sub menu parent indicator hover with animation */ .pkp_navigation_primary li.has-dropdown:hover > a:after, .pkp_navigation_primary_row li.has-dropdown:hover > a:after, .main-navigation li.has-dropdown:hover > a:after { color: #00FF3F !important; transform: rotate(180deg) scale(1.2) !important; transition: all 0.3s ease !important; } /* Arrow/caret icons animation */ .dropdown-menu .caret:hover, .sub-menu .caret:hover, .dropdown-toggle .caret:hover, .dropdown .fa:hover, .dropdown .glyphicon:hover { transform: rotate(90deg) scale(1.1) !important; color: #00FF3F !important; transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1) !important; } /* Simple Universal dropdown hover */ .pkp_structure_head ul ul a:hover, .header_warna ul ul a:hover, .pkp_head_wrapper ul ul a:hover, nav ul ul a:hover, .navigation ul ul a:hover { color: #00FF3F !important; background: rgba(255,255,255,0.15) !important; border-radius: 4px !important; } /* Simple dropdown container styling */ .dropdown-menu, .sub-menu, .pkp_navigation_primary ul ul, .main-navigation ul ul { box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; } /* Simple focus states for accessibility */ .dropdown-menu a:focus, .sub-menu a:focus, .pkp_navigation_primary .dropdown-menu a:focus, .main-navigation .dropdown-menu a:focus { color: #00FF3F !important; background: rgba(255,255,255,0.2) !important; border-radius: 4px !important; outline: 2px solid #00FF3F !important; } /* CLEAN HEADER - Normal positioning, proper z-index */ .pkp_structure_head { position: relative !important; top: auto !important; left: auto !important; right: auto !important; z-index: 100 !important; width: 100% !important; box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important; } /* Navigation with proper z-index (below header) */ .pkp_navigation_primary_wrapper { position: relative !important; z-index: 90 !important; } /* No body padding needed for non-fixed header */ body { padding-top: 0 !important; } /* Responsive adjustments */ @media (min-width: 768px) { body { padding-top: 0 !important; } } @media (min-width: 992px) { body { padding-top: 0 !important; } } @media (min-width: 1200px) { body { padding-top: 0 !important; } } /* Smooth scrolling untuk user experience */ html { scroll-behavior: smooth !important; } /* Header layout tetap rapi */ .pkp_site_name_wrapper { position: relative !important; z-index: 95 !important; padding: 0 !important; margin: 0 !important; height: 100% !important; display: flex !important; align-items: stretch !important; } /* ===== CLEAN HEADER LAYOUT - SIMPLE & EFFECTIVE ===== */ /* Header container - clean and simple */ .pkp_structure_head { padding: 0 !important; margin: 0 !important; // min-height: 80px !important; display: flex !important; align-items: center !important; } /* Container untuk header */ .pkp_structure_head .container, .pkp_structure_head > div { position: relative !important; padding: 0 15px !important; height: 100% !important; display: flex !important; align-items: center !important; width: 100% !important; } /* Header inner wrapper untuk flexbox layout */ .pkp_site_name_wrapper { width: 100% !important; display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 0 !important; margin: 0 !important; height: 100% !important; } /* Logo area */ .pkp_site_name { flex: 1 1 auto !important; margin-right: 20px !important; padding: 0 !important; height: 100% !important; display: flex !important; align-items: center !important; } /* Remove hover effects from logo link */ .pkp_site_name a, .pkp_site_name a.is_img { transition: none !important; transform: none !important; } .pkp_site_name a:hover, .pkp_site_name a.is_img:hover { transform: none !important; transition: none !important; } /* Logo image container - controlled width */ .pkp_site_name .is_img { height: 100% !important; width: 100% !important; display: flex !important; align-items: center !important; padding: 0 !important; margin: 0 !important; } /* Logo image */ .pkp_site_name .is_img img { height: 60px !important; width: 100% !important; max-width: none !important; object-fit: cover !important; object-position: left center !important; display: block !important; margin: 0 !important; padding: 0 !important; } /* Additional override for any potential conflicts */ .pkp_site_name_wrapper .pkp_site_name .is_img img, header .pkp_site_name .is_img img, .journal-description-wrapper .pkp_site_name .is_img img { width: 100% !important; max-width: none !important; min-width: 100% !important; } /* Search area - flexible but doesn't affect logo */ .ms-auto { flex: 1 1 auto !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; margin: 0 10px !important; padding: 0 !important; max-width: 350px !important; z-index: 1000 !important; } /* User navigation - consistent whether logged in or not */ #navigationUserWrapper { flex: 0 0 auto !important; display: flex !important; align-items: center !important; margin: 0 !important; border-radius: 20px !important; background: rgba(255,255,255,0.15) !important; white-space: nowrap !important; } /* Handle when user navigation is missing (not logged in) */ .pkp_site_name_wrapper:not(:has(#navigationUserWrapper)) .ms-auto { padding-right: 15px !important; } /* Alternative selector for browsers that don't support :has */ .ms-auto:last-child { padding-right: 15px !important; } /* User navigation links */ #navigationUserWrapper a { color: white !important; text-decoration: none !important; font-weight: 500 !important; font-size: 14px !important; } /* User navigation buttons/items background */ #navigationUserWrapper, #navigationUserWrapper li, #navigationUser, #navigationUser li, .user-nav, .user-nav li { background-color: #154F5A !important; border-radius: 5px !important; } /* User navigation buttons/items hover background */ #navigationUserWrapper:hover, #navigationUserWrapper li:hover, #navigationUser:hover, #navigationUser li:hover, .user-nav:hover, .user-nav li:hover { background-color: #096539 !important; transition: background-color 0.3s ease !important; } /* User navigation main buttons */ #navigationUserWrapper > li > a, #navigationUser > li > a, .user-nav > li > a { background-color: #154F5A !important; color: #ecf0f1 !important; border-radius: 5px !important; margin: 0 2px !important; } /* User navigation main buttons hover */ #navigationUserWrapper > li > a:hover, #navigationUser > li > a:hover, .user-nav > li > a:hover { background-color: #0f4c21 !important; color: #ffffff !important; text-decoration: none !important; opacity: 1 !important; filter: none !important; } #navigationUserWrapper a:hover { color: #ffffff !important; text-decoration: none !important; opacity: 1 !important; filter: none !important; } /* User Navigation Dropdown Styling */ #navigationUserWrapper ul, #navigationUserWrapper .dropdown-menu, #navigationUser ul { background-color: #154F5A !important; border-radius: 8px !important; box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important; } /* Agar dropdown tidak tertutup wrapper dan bisa muncul ke kiri */ .pkp_site_name_wrapper { overflow: visible !important; z-index: 90 !important; } #navigationUserWrapper { position: relative !important; z-index: 100 !important; } #navigationUser > li.profile, #navigationUser > li.profile > a, #navigationUserWrapper .dropdown-menu a { color: #FFFFFF !important; display: block !important; background: transparent !important; border-radius: 4px !important; margin: 2px 5px !important; } /* Dropdown menu user navigation: default ke kanan, bisa dibalik ke kiri jika perlu */ #navigationUser > li.profile > ul, #navigationUser > li > ul { display: none !important; position: absolute !important; right: 0 !important; left: auto !important; top: 100% !important; min-width: 180px !important; z-index: 2000 !important; background: #154F5A !important; border-radius: 8px !important; box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important; } /* Tampilkan dropdown hanya saat tombol admin di-hover */ #navigationUser > li.profile:hover > ul, #navigationUser > li.profile:focus-within > ul { display: block !important; } /* Jika ingin dropdown ke kiri tombol admin, ganti right: 0 menjadi left: 0 dan right: auto */ /* #navigationUser > li.profile > ul, #navigationUser > li > ul { left: 0 !important; right: auto !important; } */ /* User Navigation Dropdown Hover */ #navigationUserWrapper ul a:hover, #navigationUserWrapper .dropdown-menu a:hover, #navigationUser ul a:hover { color: #ffffff !important; background-color: rgba(255,255,255,0.15) !important; text-decoration: none !important; opacity: 1 !important; filter: none !important; } /* Task Count Badge in Dropdown */ #navigationUserWrapper .task_count, #navigationUser .task_count { background-color: #e74c3c !important; color:white !important; border-radius: 10px !important; font-size: 11px !important; font-weight: bold !important; } /* Additional selectors for dropdown - more specific targeting */ .navbar-nav .dropdown-menu, ul.nav-menu, .nav .dropdown-menu, .dropdown-menu { background-color: #154F5A !important; border: 1px solid rgba(255,255,255,0.2) !important; border-radius: 8px !important; box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important; padding: 5px 0 !important; margin-top: 5px !important; z-index: 1050 !important; } /* Dropdown links - comprehensive targeting */ .navbar-nav .dropdown-menu a, ul.nav-menu a, .nav .dropdown-menu a, .dropdown-menu a, .dropdown-menu li a { color: #ecf0f1 !important; display: block !important; background: transparent !important; border-radius: 4px !important; margin: 2px 5px !important; text-decoration: none !important; } /* Dropdown hover - comprehensive targeting */ .navbar-nav .dropdown-menu a:hover, ul.nav-menu a:hover, .nav .dropdown-menu a:hover, .dropdown-menu a:hover, .dropdown-menu li a:hover { color: #ecf0f1 !important; background-color: rgba(21, 79, 90, 0.8) !important; text-decoration: none !important; } /* Dropdown items and list items */ .dropdown-menu li, .navbar-nav .dropdown-menu li, ul.nav-menu li { background: transparent !important; border: none !important; } /* Make sure dropdown is visible and positioned correctly */ .dropdown-menu.show, .dropdown-menu:not(.d-none) { display: block !important; opacity: 1 !important; visibility: visible !important; } /* Task count badge - more comprehensive */ .task_count, .badge, .nav-badge { background-color: #e74c3c !important; color: white !important; border-radius: 10px !important; font-size: 11px !important; font-weight: bold !important; } /* Force dark background for any potential white dropdown issues */ #navigationUser ul, #navigationUserWrapper ul, .navigation ul, .user-nav ul, .nav ul, .navbar ul, .header ul.dropdown-menu, .pkp_structure_head ul.dropdown-menu { background-color: #154F5A !important; color: #ecf0f1 !important; } /* Force text color for any potential white text issues */ #navigationUser ul a, #navigationUserWrapper ul a, .navigation ul a, .user-nav ul a, .nav ul a, .navbar ul a, .header ul.dropdown-menu a, .pkp_structure_head ul.dropdown-menu a { color: #FFFFFF !important; background: transparent !important; } /* Force hover colors */ #navigationUser ul a:hover, #navigationUserWrapper ul a:hover, .navigation ul a:hover, .user-nav ul a:hover, .nav ul a:hover, .navbar ul a:hover, .header ul.dropdown-menu a:hover, .pkp_structure_head ul.dropdown-menu a:hover { color: #00FF3F !important; background-color: rgba(255, 255, 255, 0.15) !important; text-decoration: none !important; } /* Override any Bootstrap or theme defaults that might cause white text */ .dropdown-item { color: #ecf0f1 !important; background-color: transparent !important; } .dropdown-item:hover, .dropdown-item:focus { color: #ecf0f1 !important; background-color: rgba(21, 79, 90, 0.8) !important; } /* Ensure proper contrast for any Bootstrap navbar components */ .navbar-nav .nav-link, .navbar-nav .dropdown-item { color: #ecf0f1 !important; } .navbar-nav .nav-link:hover, .navbar-nav .dropdown-item:hover { color: #ecf0f1 !important; background-color: rgba(21, 79, 90, 0.8) !important; } /* Additional comprehensive targeting for all possible dropdown scenarios */ ul.dropdown-menu, .dropdown ul, .btn-group ul, .nav-item ul, .user-menu ul, .admin-menu ul { background-color: #154F5A !important; border: 1px solid rgba(255,255,255,0.2) !important; border-radius: 8px !important; box-shadow: 0 5px 15px rgba(0,0,0,0.3) !important; z-index: 1050 !important; } ul.dropdown-menu a, .dropdown ul a, .btn-group ul a, .nav-item ul a, .user-menu ul a, .admin-menu ul a, ul.dropdown-menu li a, .dropdown ul li a, .btn-group ul li a, .nav-item ul li a, .user-menu ul li a, .admin-menu ul li a { color: #ecf0f1 !important; background: transparent !important; display: block !important; text-decoration: none !important; } ul.dropdown-menu a:hover, .dropdown ul a:hover, .btn-group ul a:hover, .nav-item ul a:hover, .user-menu ul a:hover, .admin-menu ul a:hover, ul.dropdown-menu li a:hover, .dropdown ul li a:hover, .btn-group ul li a:hover, .nav-item ul li a:hover, .user-menu ul li a:hover, .admin-menu ul li a:hover { color: #ecf0f1 !important; background-color: rgba(21, 79, 90, 0.8) !important; text-decoration: none !important; } /* Responsive design - MAINTAIN FULL WIDTH logo */ @media (max-width: 992px) { .pkp_site_name { /* Keep flex: 1 1 auto to maintain full width */ margin-right: 15px !important; } .pkp_site_name .is_img img { height: 50px !important; /* Keep width: 100% for full width */ } .ms-auto { max-width: 200px !important; font-size: 13px !important; z-index: 1000 !important; } #navigationUserWrapper { font-size: 13px !important; z-index: 1000 !important; } #menu-open { z-index: 1000 !important; } } @media (max-width: 768px) { .pkp_structure_head { min-height: 60px !important; } .pkp_site_name { width: 200px !important; max-width: 200px !important; margin-right: 15px !important; } .pkp_site_name .is_img img { height: 40px !important; } .pkp_site_name_wrapper { flex-direction: row !important; gap: 10px !important; } .ms-auto { max-width: 180px !important; font-size: 12px !important; z-index: 1000 !important; } #navigationUserWrapper { font-size: 12px !important; } } @media (max-width: 480px) { .pkp_structure_head { min-height: 50px !important; } .pkp_site_name { width: 150px !important; max-width: 150px !important; } .pkp_site_name .is_img img { height: 35px !important; } .ms-auto { max-width: 140px !important; font-size: 11px !important; z-index: 1000 !important; } #navigationUserWrapper { font-size: 11px !important; } } /* FORCE CORRECT Z-INDEX HIERARCHY */ /* Header at top level */ .pkp_structure_head { z-index: 100 !important; } /* Site name/logo inside header */ .pkp_site_name_wrapper, .pkp_site_name { z-index: 95 !important; } /* Navigation below header */ .pkp_navigation_primary_wrapper, .pkp_navigation_primary, .pkp_navigation_primary_row { z-index: 90 !important; } /* Only dropdown menus get higher z-index than navigation */ .pkp_navigation_primary .dropdown-menu, .pkp_navigation_primary ul ul, .dropdown-menu, .sub-menu, .pkp_site_nav_menu ul { z-index: 200 !important; } /* Content should be below navigation */ .pkp_structure_content, .pkp_structure_main, .pkp_structure_sidebar { z-index: 10 !important; } /* Footer at bottom */ .pkp_structure_footer { z-index: 10 !important; } /* Override any inline z-index that might be problematic */ .pkp_navigation_primary * { z-index: inherit !important; } /* Ensure navigation links don't have excessive z-index */ .pkp_navigation_primary a, .pkp_navigation_primary_row a { z-index: auto !important; } /* Cache-busting: 1756770940 */