/* ========================================
   UNIDA MODERN THEME v4
   Clean & Professional
   ======================================== */

:root {
    --primary-dark: #002b80;
    --primary-blue: #0052cc;
    --accent-blue: #0066ff;
    --light-blue: #3385ff;
    --white: #FFFFFF;
    --light-gray: #F8F9FA;
    --text-dark: #1A1A1A;
    --text-gray: #6C757D;
    --border-gray: #e9ecef;
    --shadow-sm: 0 2px 8px rgba(0, 43, 128, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 43, 128, 0.12);
    --shadow-lg: 0 8px 32px rgba(0, 43, 128, 0.16);
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

*, *::before, *::after { box-sizing: border-box; }

body, html {
    margin: 0 !important;
    padding: 0 !important;
    background: var(--light-gray) !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    color: var(--text-dark) !important;
    line-height: 1.6 !important;
}

a { color: var(--primary-blue); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--accent-blue); }

.ep_tm_header, .ep_tm_footer, #ep_tm_header, #ep_tm_footer { display: none !important; }

/* ========================================
   HEADER - Same as Homepage
   ======================================== */
.modern-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary-blue));
    box-shadow: var(--shadow-md);
}

.header-top {
    background: rgba(0, 0, 0, 0.15);
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.header-top-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.top-contact {
    display: flex;
    gap: 20px;
}

.contact-link {
    color: rgba(255, 255, 255, 0.9) !important;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85em;
    transition: var(--transition);
}

.contact-link:hover { color: white !important; }

.top-actions {
    display: flex;
    gap: 10px;
}

.top-btn {
    padding: 6px 16px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.1);
    color: white !important;
    font-size: 0.85em;
    font-weight: 600;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 5px;
}

.top-btn:hover { background: rgba(255, 255, 255, 0.2); }

.header-main { padding: 15px 0; }

.header-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.brand-section {
    display: flex;
    align-items: center;
    gap: 15px;
    text-decoration: none !important;
}

.brand-logo { height: 50px; width: auto; }

.brand-info { display: flex; flex-direction: column; }

.brand-title {
    font-size: 1.25em;
    font-weight: 800;
    margin: 0;
    color: white !important;
    line-height: 1.2;
}

.brand-subtitle {
    font-size: 0.8em;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    font-weight: 500;
}

/* Desktop Navigation */
.desktop-nav {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-left: auto;
}

.nav-item {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 600;
    font-size: 0.9em;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
    transition: var(--transition);
}

.nav-item:hover {
    color: white !important;
    background: rgba(255, 255, 255, 0.15);
}

.nav-item.btn-login {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.nav-item.btn-login:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* Dropdown */
.nav-item-dropdown {
    position: relative;
}

.nav-item-dropdown .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    min-width: 200px;
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: var(--transition);
    z-index: 1001;
}

.nav-item-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    color: var(--text-dark) !important;
    border-radius: 8px;
    font-weight: 500;
    transition: var(--transition);
}

.dropdown-item:hover {
    background: var(--light-gray);
    color: var(--primary-blue) !important;
}

.dropdown-item i {
    color: var(--primary-blue);
    width: 20px;
}

.header-user-menu {
    display: flex;
    gap: 8px;
}

/* ========================================
   SECONDARY USER NAVBAR
   ======================================== */
.user-navbar {
    background: linear-gradient(135deg, #001a4d, var(--primary-dark));
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: none;
}

.user-navbar.has-menu { display: block; }

.user-navbar-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.user-navbar-left {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85em;
}

.user-navbar-left i { font-size: 1.2em; }

.navbar-label { font-weight: 500; }

.user-navbar-menu {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.user-nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 600;
    font-size: 0.85em;
    padding: 8px 14px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.1);
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.user-nav-link:hover {
    background: rgba(255, 255, 255, 0.2);
    color: white !important;
}

.user-nav-link.btn-login {
    background: linear-gradient(135deg, var(--accent-blue), var(--primary-blue));
    box-shadow: 0 2px 8px rgba(0, 102, 255, 0.3);
}

.user-nav-link.btn-logout {
    background: rgba(220, 53, 69, 0.2);
    border: 1px solid rgba(220, 53, 69, 0.3);
}

/* ========================================
   SIDEBAR
   ======================================== */
.sidebar-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    transition: var(--transition);
}

.main-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 300px;
    height: 100vh;
    background: white;
    z-index: 1002;
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: var(--transition);
    box-shadow: var(--shadow-lg);
}

.sidebar-open .sidebar-overlay {
    opacity: 1;
    visibility: visible;
}

.sidebar-open .main-sidebar {
    transform: translateX(0);
}

.sidebar-header {
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary-blue));
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar-logo {
    height: 36px;
    width: auto;
}

.sidebar-brand-text {
    font-size: 1.1em;
    font-weight: 700;
    color: white;
}

.sidebar-close {
    width: 36px;
    height: 36px;
    border: none;
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.sidebar-close:hover { background: rgba(255, 255, 255, 0.3); }

.sidebar-search {
    padding: 16px 20px;
    background: var(--light-gray);
    border-bottom: 1px solid var(--border-gray);
}

.search-box {
    display: flex;
    align-items: center;
    background: white;
    border: 2px solid var(--border-gray);
    border-radius: 10px;
    overflow: hidden;
    transition: var(--transition);
}

.search-box:focus-within {
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 3px rgba(0, 82, 204, 0.1);
}

.search-box i { padding: 0 14px; color: var(--text-gray); }

.search-box input {
    flex: 1;
    border: none;
    padding: 12px 0;
    font-size: 0.95em;
    outline: none;
    font-family: inherit;
}

.search-box button {
    padding: 12px 16px;
    border: none;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    color: white;
    cursor: pointer;
    transition: var(--transition);
}

.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding: 10px 0;
}

.nav-section { padding: 10px 20px; }

.nav-section-title {
    display: block;
    font-size: 0.7em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-gray);
    margin-bottom: 10px;
    padding-left: 4px;
}

.nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    color: var(--text-dark) !important;
    border-radius: 10px;
    transition: var(--transition);
    margin-bottom: 4px;
    font-weight: 500;
}

.nav-link:hover {
    background: var(--light-gray);
    color: var(--primary-blue) !important;
}

.nav-link i {
    width: 20px;
    text-align: center;
    color: var(--primary-blue);
}

.nav-link span { flex: 1; }

.nav-external { font-size: 0.7em; opacity: 0.5; }

.styled-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.styled-menu li { margin: 0 0 6px 0; }

.styled-menu li a.nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    color: white !important;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    border-radius: 10px;
    transition: var(--transition);
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0, 82, 204, 0.25);
}

.styled-menu li a.nav-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.35);
}

.styled-menu li a.nav-link i {
    color: white;
    width: 20px;
    text-align: center;
}

.styled-menu li a.nav-link span {
    flex: 1;
    color: white;
}

/* Original EPrints menu styling override */
#sidebarUserMenu .ep_tm_key_tools {
    list-style: none;
    margin: 0;
    padding: 0;
}

#sidebarUserMenu .ep_tm_key_tools li {
    margin: 0 0 8px 0;
}

#sidebarUserMenu .ep_tm_key_tools li a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    color: white !important;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    border-radius: 12px;
    transition: var(--transition);
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 3px 10px rgba(0, 82, 204, 0.3);
}

#sidebarUserMenu .ep_tm_key_tools li a:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 82, 204, 0.4);
    background: linear-gradient(135deg, var(--accent-blue), var(--primary-blue));
}

#sidebarUserMenu .ep_tm_key_tools li a span {
    display: flex;
    align-items: center;
    gap: 10px;
    color: white !important;
}

#sidebarUserMenu .ep_tm_key_tools li a span i {
    font-size: 1.1em;
}

#sidebarUserMenu .ep_tm_key_tools li a span strong {
    font-weight: 700;
    font-size: 0.95em !important;
}

.sidebar-footer {
    padding: 16px 20px;
    border-top: 1px solid var(--border-gray);
    text-align: center;
}

.sidebar-footer p {
    margin: 0;
    font-size: 0.8em;
    color: var(--text-gray);
}

/* ========================================
   LOGIN PAGE - Override main-content
   ======================================== */
.main-content.login-page-content {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Fallback: target by content */
.main-content:has(.modern-login-container),
.main-content:has(.login-card) {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Also target ep_block which EPrints uses */
.ep_block:has(.modern-login-container),
.ep_block:has(.login-card) {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border: none !important;
}

.modern-login-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: 950px;
    margin: 0 auto;
    padding: 20px;
}

.login-card {
    background: white;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 43, 128, 0.15);
}

.login-header {
    text-align: center;
    margin-bottom: 30px;
}

.login-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #0052cc, #0066ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.login-icon i {
    font-size: 40px;
    color: white;
}

.login-header h2 {
    color: #002b80;
    font-size: 1.8em;
    margin: 0 0 8px 0;
    font-weight: 700;
}

.login-header p {
    color: #6c757d;
    margin: 0;
}

.login-form .form-group {
    margin-bottom: 20px;
}

.login-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #002b80;
}

.login-form label i {
    margin-right: 8px;
    color: #0052cc;
}

.login-form input[type="text"],
.login-form input[type="password"] {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 2px solid #e9ecef !important;
    border-radius: 12px !important;
    font-size: 1em !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    background: white !important;
}

.login-form input[type="text"]:focus,
.login-form input[type="password"]:focus {
    border-color: #0052cc !important;
    box-shadow: 0 0 0 4px rgba(0, 82, 204, 0.1) !important;
    outline: none !important;
}

.form-actions {
    margin-top: 25px;
}

.form-actions input[type="submit"] {
    width: 100% !important;
    padding: 16px !important;
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 1.1em !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0, 82, 204, 0.3) !important;
}

.form-actions input[type="submit"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.4) !important;
}

.login-links {
    display: flex;
    justify-content: space-between;
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid #e9ecef;
}

.link-item {
    color: #0052cc !important;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 0.9em;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s ease;
}

.link-item:hover {
    color: #0066ff !important;
}

.link-register {
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white !important;
    padding: 10px 20px;
    border-radius: 8px;
}

.link-register:hover {
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.3);
}

.login-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.info-card {
    background: linear-gradient(135deg, #002b80, #0052cc);
    border-radius: 20px;
    padding: 30px;
    color: white;
}

.info-card h3 {
    margin: 0 0 20px 0;
    font-size: 1.2em;
    display: flex;
    align-items: center;
    gap: 10px;
}

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

.info-card li {
    padding: 10px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.info-card li:last-child {
    border-bottom: none;
}

.info-card li i {
    color: #4ade80;
}

.help-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.help-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px;
    background: white;
    color: #002b80 !important;
    text-decoration: none !important;
    border-radius: 12px;
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.1);
}

.help-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 43, 128, 0.15);
}

.help-btn.whatsapp {
    background: #25D366;
    color: white !important;
}

.help-btn.whatsapp:hover {
    background: #128C7E;
}

@media (max-width: 768px) {
    .modern-login-container {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 15px;
    }
    
    .login-card {
        padding: 30px 20px;
    }
    
    .login-links {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }
    
    .link-register {
        width: 100%;
        justify-content: center;
    }
}

/* ========================================
   MAIN CONTENT
   ======================================== */
.main-wrapper {
    min-height: calc(100vh - 200px);
    display: flex;
    flex-direction: column;
}

.page-header {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary-blue));
    padding: 30px 0;
}

.page-header-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.page-title {
    color: white;
    font-size: 1.8em;
    font-weight: 700;
    margin: 0;
}

.content-area {
    flex: 1;
    padding: 30px 20px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

.main-content {
    background: white;
    border-radius: 16px;
    padding: 30px;
    box-shadow: var(--shadow-sm);
}

/* EPrints Content */
.main-content h2 {
    color: var(--primary-dark);
    font-size: 1.4em;
    font-weight: 700;
    margin: 0 0 20px 0;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--border-gray);
}

.main-content h3 {
    color: var(--primary-dark);
    font-size: 1.2em;
    font-weight: 600;
    margin: 25px 0 15px 0;
}

.main-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.main-content th, .main-content td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid var(--border-gray);
}

.main-content th {
    background: var(--light-gray);
    font-weight: 600;
    color: var(--primary-dark);
}

.main-content input[type="submit"],
.main-content input[type="button"],
.main-content button,
.ep_form_action_button {
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue)) !important;
    color: white !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: var(--transition) !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.25) !important;
}

.main-content input[type="text"],
.main-content input[type="email"],
.main-content input[type="password"],
.main-content input[type="search"],
.main-content select,
.main-content textarea {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid var(--border-gray);
    border-radius: 10px;
    font-size: 1em;
    font-family: inherit;
    transition: var(--transition);
}

.main-content input:focus,
.main-content select:focus,
.main-content textarea:focus {
    outline: none;
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 4px rgba(0, 82, 204, 0.1);
}

.ep_search_result, .eprint_citation {
    padding: 20px;
    margin: 15px 0;
    background: var(--light-gray);
    border-radius: 12px;
    border-left: 4px solid var(--primary-blue);
    transition: var(--transition);
}

.ep_search_result:hover, .eprint_citation:hover {
    box-shadow: var(--shadow-md);
    transform: translateX(5px);
}

.ep_document_box {
    background: linear-gradient(135deg, #e8f0fe, white);
    border: 2px solid var(--border-gray);
    border-radius: 12px;
    padding: 20px;
    margin: 20px 0;
}

.ep_document_box a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    color: white !important;
    border-radius: 8px;
    font-weight: 600;
}

.ep_msg_warning {
    background: #fff3cd;
    border-left: 4px solid #ffc107;
    padding: 15px 20px;
    border-radius: 10px;
    margin: 15px 0;
}

.ep_msg_error {
    background: #f8d7da;
    border-left: 4px solid #dc3545;
    padding: 15px 20px;
    border-radius: 10px;
    margin: 15px 0;
}

.ep_msg_message {
    background: #d1e7dd;
    border-left: 4px solid #198754;
    padding: 15px 20px;
    border-radius: 10px;
    margin: 15px 0;
}

/* ========================================
   FOOTER
   ======================================== */
.main-footer {
    background: linear-gradient(135deg, var(--primary-dark), #001a4d);
    color: white;
    padding: 50px 0 0;
    margin-top: auto;
}

.footer-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-col h4 {
    font-size: 1.1em;
    font-weight: 700;
    margin: 0 0 20px 0;
}

.footer-col p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9em;
    margin: 0;
}

.footer-col a {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 0.9em;
    padding: 8px 0;
    transition: var(--transition);
}

.footer-col a:hover {
    color: white !important;
    padding-left: 5px;
}

.footer-bottom {
    padding: 25px 0;
    text-align: center;
}

.footer-bottom p {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.85em;
    margin: 0;
}

/* ========================================
   MOBILE BOTTOM NAVIGATION - Same as Homepage
   ======================================== */
.mobile-nav {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    box-shadow: 0 -4px 20px rgba(0, 43, 128, 0.3);
    z-index: 1000;
    padding: 10px 0;
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-nav-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    max-width: 600px;
    margin: 0 auto;
}

.mobile-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px;
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none !important;
    font-size: 0.7em;
    font-weight: 600;
    transition: var(--transition);
    border-radius: 10px;
    background: none;
    border: none;
    cursor: pointer;
}

.mobile-nav-item i {
    font-size: 1.4em;
}

.mobile-nav-item.active,
.mobile-nav-item:hover {
    color: white !important;
    background: rgba(255, 255, 255, 0.15);
    transform: translateY(-2px);
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 1200px) {
    .user-nav-link span { display: none; }
    .user-nav-link { padding: 8px 10px; }
    .navbar-label { display: none; }
}

@media (max-width: 992px) {
    .desktop-nav { display: none !important; }
    .user-navbar { display: none !important; }
    .mobile-nav { display: block !important; }
    
    .main-wrapper { padding-bottom: 80px; }
    
    .footer-grid { grid-template-columns: 1fr; gap: 30px; }
}

@media (max-width: 768px) {
    /* Mobile Header - Same as Homepage */
    .header-top { display: none !important; }
    
    .header-main { padding: 12px 0; }
    
    .header-content {
        justify-content: center;
    }
    
    .brand-section {
        justify-content: center;
    }
    
    .brand-info { display: none !important; }
    
    .brand-logo { 
        height: 45px;
    }
    
    /* Page adjustments */
    .page-header { padding: 20px 0; }
    .page-title { font-size: 1.3em; }
    
    .content-area { padding: 20px 15px; }
    .main-content { padding: 20px; border-radius: 12px; }
    
    .main-sidebar { width: 100%; max-width: 300px; }
}

@media (max-width: 480px) {
    .header-content { padding: 0 15px; }
    .brand-logo { height: 40px; }
    
    .content-area { padding: 15px 10px; }
    .main-content { padding: 15px; }
    .page-header-content { padding: 0 15px; }
    .page-title { font-size: 1.1em; }
}

/* User menu link styling */
.user-menu-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    margin: 4px;
    color: white !important;
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue));
    border-radius: 10px;
    font-weight: 600;
    text-decoration: none !important;
    transition: var(--transition);
    box-shadow: 0 3px 10px rgba(0, 82, 204, 0.3);
}

.user-menu-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 82, 204, 0.4);
}

.user-menu-link i {
    font-size: 1em;
}

/* Hide duplicate menus */
#sidebarUserMenu .ep_tm_key_tools:not(.styled-menu) { display: none; }

/* ========================================
   LOGIN PAGE FIX - Remove Glass Card Effect
   Override auto.css glass/blur styles
   ======================================== */

/* Reset body background for login page - remove gradient */
body.ep_tm_screen_Screen_Login,
body.page-login {
    background: var(--light-gray) !important;
    min-height: auto !important;
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
    padding: 0 !important;
    position: relative !important;
    overflow-x: visible !important;
}

/* Remove animated background shapes */
body.ep_tm_screen_Screen_Login::before,
body.page-login::before {
    display: none !important;
    content: none !important;
}

/* Reset login container - remove glass effect */
.ep_tm_screen_Screen_Login .ep_tm_content,
.page-login .login-container,
form[action*="/users/login"],
.ep_tm_screen_Screen_Login #ep_tm_page_content,
.page-login #ep_tm_page_content {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    animation: none !important;
    overflow: visible !important;
    max-width: none !important;
    width: auto !important;
}

/* Remove top decoration line */
.ep_tm_screen_Screen_Login .ep_tm_content::before,
.page-login .login-container::before {
    display: none !important;
    content: none !important;
}

/* Style the actual login form box cleanly */
.ep_block {
    background: white !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: var(--shadow-sm) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    margin: 20px auto !important;
    max-width: 600px !important;
}

/* Clean login form styling */
.ep_block table {
    width: 100% !important;
}

.ep_block td {
    padding: 8px 0 !important;
}

.ep_block input[type="text"],
.ep_block input[type="password"],
.ep_block input[type="email"] {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 2px solid var(--border-gray) !important;
    border-radius: 10px !important;
    font-size: 1em !important;
    transition: var(--transition) !important;
    background: white !important;
}

.ep_block input[type="text"]:focus,
.ep_block input[type="password"]:focus,
.ep_block input[type="email"]:focus {
    outline: none !important;
    border-color: var(--primary-blue) !important;
    box-shadow: 0 0 0 4px rgba(0, 82, 204, 0.1) !important;
}

.ep_block input[type="submit"],
.ep_block button {
    background: linear-gradient(135deg, var(--primary-blue), var(--accent-blue)) !important;
    color: white !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: var(--transition) !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.25) !important;
}

.ep_block input[type="submit"]:hover,
.ep_block button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.35) !important;
}

/* ========================================
   LOGIN PAGE FIX v2 - More Aggressive Override
   ======================================== */

/* Override main-content card for login page */
body.ep_tm_screen_Screen_Login .main-content,
body.page-login .main-content,
body[class*="login"] .main-content,
body[class*="Login"] .main-content {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* Override content-area for login */
body.ep_tm_screen_Screen_Login .content-area,
body.page-login .content-area,
body[class*="login"] .content-area,
body[class*="Login"] .content-area {
    background: transparent !important;
    padding: 20px !important;
}

/* Override page-header for login */
body.ep_tm_screen_Screen_Login .page-header,
body.page-login .page-header,
body[class*="login"] .page-header,
body[class*="Login"] .page-header {
    display: none !important;
}

/* Remove ALL glass effects from auto.css */
body.ep_tm_screen_Screen_Login .ep_tm_content,
body.ep_tm_screen_Screen_Login #ep_tm_page_content,
body.ep_tm_screen_Screen_Login form,
body.page-login .ep_tm_content,
body.page-login #ep_tm_page_content {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    animation: none !important;
    max-width: none !important;
}

/* Remove pseudo-elements decorations */
body.ep_tm_screen_Screen_Login .ep_tm_content::before,
body.ep_tm_screen_Screen_Login .ep_tm_content::after,
body.page-login .login-container::before,
body.page-login .login-container::after {
    display: none !important;
    content: none !important;
}

/* Clean ep_block styling - the actual form container */
body.ep_tm_screen_Screen_Login .ep_block,
body.page-login .ep_block,
body[class*="login"] .ep_block,
body[class*="Login"] .ep_block {
    background: white !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    margin: 0 auto !important;
    max-width: 500px !important;
    border: none !important;
}

/* Override any remaining glass/blur effects globally on login */
body.ep_tm_screen_Screen_Login *,
body.page-login * {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Ensure body doesn't have gradient background */
body.ep_tm_screen_Screen_Login,
body.page-login {
    background: #F8F9FA !important;
}

body.ep_tm_screen_Screen_Login::before,
body.ep_tm_screen_Screen_Login::after,
body.page-login::before,
body.page-login::after {
    display: none !important;
    content: none !important;
}

/* Hide empty ep_login_tools div */
.ep_block.ep_login_tools:empty,
.ep_login_tools:empty {
    display: none !important;
}

/* If ep_login_tools has no visible content */
.ep_block.ep_login_tools {
    display: none !important;
}

/* ========================================

/* ========================================
   LOGOUT PAGE STYLING
   ======================================== */

/* Apply same clean styling as login page */
body.ep_tm_screen_Screen_Logout .main-content,
body.ep_tm_screen_Screen_Loggedout .main-content {
    background: white !important;
    border-radius: 12px !important;
    padding: 40px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
    max-width: 600px !important;
    margin: 40px auto !important;
}

/* Center content */
body.ep_tm_screen_Screen_Logout .content-area,
body.ep_tm_screen_Screen_Loggedout .content-area {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 50vh !important;
}

/* Style logout message */
body.ep_tm_screen_Screen_Logout .ep_msg_message,
body.ep_tm_screen_Screen_Loggedout .ep_msg_message {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

/* Hover effects for buttons */
body.ep_tm_screen_Screen_Logout a[href*="base_url"]:hover,
body.ep_tm_screen_Screen_Loggedout a[href*="base_url"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.35) !important;
}

body.ep_tm_screen_Screen_Logout a[href*="login"]:hover,
body.ep_tm_screen_Screen_Loggedout a[href*="login"]:hover {
    background: #f8f9fa !important;
}

/* ========================================
   LOGOUT PAGE - Selaras dengan Login
   ======================================== */

/* Remove parent card styling */
.main-content:has(.modern-logout-container),
.ep_block:has(.modern-logout-container) {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
}

.modern-logout-container {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
}

.logout-card {
    background: white;
    border-radius: 20px;
    padding: 50px 40px;
    box-shadow: 0 10px 40px rgba(0, 43, 128, 0.15);
    text-align: center;
}

.logout-header {
    margin-bottom: 35px;
}

.logout-icon {
    width: 100px;
    height: 100px;
    background: linear-gradient(135deg, #28a745, #20c997);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    box-shadow: 0 8px 25px rgba(40, 167, 69, 0.3);
}

.logout-icon i {
    font-size: 50px;
    color: white;
}

.logout-header h2 {
    color: #002b80;
    font-size: 1.8em;
    margin: 0 0 10px 0;
    font-weight: 700;
}

.logout-header p {
    color: #6c757d;
    margin: 0;
    font-size: 1.05em;
}

.logout-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.logout-actions .btn-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 24px;
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white !important;
    text-decoration: none !important;
    border-radius: 12px;
    font-weight: 700;
    font-size: 1.05em;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 82, 204, 0.3);
}

.logout-actions .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.4);
}

.logout-actions .btn-secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 24px;
    background: white;
    color: #0052cc !important;
    text-decoration: none !important;
    border-radius: 12px;
    font-weight: 600;
    font-size: 1em;
    border: 2px solid #0052cc;
    transition: all 0.3s ease;
}

.logout-actions .btn-secondary:hover {
    background: #f8f9fa;
    transform: translateY(-2px);
}

/* Hide message wrapper styling */
.ep_msg_message:has(.modern-logout-container) {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Responsive */
@media (max-width: 480px) {
    .logout-card {
        padding: 40px 25px;
    }
    
    .logout-icon {
        width: 80px;
        height: 80px;
    }
    
    .logout-icon i {
        font-size: 40px;
    }
    
    .logout-header h2 {
        font-size: 1.5em;
    }
}

/* ========================================
   LOGOUT PAGE FIX
   ======================================== */

/* Remove main-content wrapper for logout page */
body.ep_tm_screen_Screen_Logout .main-content,
body[class*="Logout"] .main-content {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* Hide page header for logout */
body.ep_tm_screen_Screen_Logout .page-header,
body[class*="Logout"] .page-header {
    display: none !important;
}

/* Style ep_messages directly */
body.ep_tm_screen_Screen_Logout #ep_messages,
body[class*="Logout"] #ep_messages {
    background: white !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
    margin: 40px auto !important;
    max-width: 500px !important;
    text-align: center !important;
}

/* Hide homepage link button */
body.ep_tm_screen_Screen_Logout a[href*="/"]:not([href*="login"]),
body[class*="Logout"] a[href*="/"]:not([href*="login"]) {
    display: none !important;
}

/* Keep only specific text visible, hide the link */
body.ep_tm_screen_Screen_Logout .ep_block a,
body[class*="Logout"] .ep_block a {
    display: none !important;
}

/* ========================================
   LOGOUT PAGE FIX v2 - Correct Structure
   ======================================== */

/* Remove main-content wrapper completely */
body.ep_tm_screen_Screen_Logout .main-content,
body.ep_tm_screen_Screen_Loggedout .main-content,
body[class*="Logout"] .main-content {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

/* Remove content-area padding */
body.ep_tm_screen_Screen_Logout .content-area,
body.ep_tm_screen_Screen_Loggedout .content-area,
body[class*="Logout"] .content-area {
    padding: 20px !important;
}

/* Hide page header */
body.ep_tm_screen_Screen_Logout .page-header,
body.ep_tm_screen_Screen_Loggedout .page-header,
body[class*="Logout"] .page-header {
    display: none !important;
}

/* Hide ep_messages wrapper */
body.ep_tm_screen_Screen_Logout #ep_messages,
body.ep_tm_screen_Screen_Loggedout #ep_messages,
body[class*="Logout"] #ep_messages {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* Style modern-logout-container */
.modern-logout-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 50vh !important;
    padding: 20px !important;
}

/* Style logout-card */
.logout-card {
    background: white !important;
    border-radius: 16px !important;
    padding: 40px !important;
    box-shadow: 0 4px 16px rgba(0, 43, 128, 0.12) !important;
    max-width: 500px !important;
    width: 100% !important;
    text-align: center !important;
}

.logout-icon {
    width: 80px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #10b981, #059669) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.logout-icon i {
    font-size: 40px !important;
    color: white !important;
}

.logout-header h2 {
    color: #002b80 !important;
    font-size: 1.8em !important;
    margin: 0 0 10px 0 !important;
    font-weight: 700 !important;
}

.logout-header p {
    color: #6c757d !important;
    margin: 0 0 30px 0 !important;
}

.logout-actions {
    display: flex !important;
    gap: 15px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.logout-actions .btn-primary,
.logout-actions .btn-secondary {
    padding: 12px 24px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: all 0.3s ease !important;
}

.logout-actions .btn-primary {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
}

.logout-actions .btn-secondary {
    background: white !important;
    color: #0052cc !important;
    border: 2px solid #0052cc !important;
}

.logout-actions .btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.35) !important;
}

.logout-actions .btn-secondary:hover {
    background: #f8f9fa !important;
}

/* Hide any other links outside logout-actions */
body.ep_tm_screen_Screen_Logout .ep_block > a,
body.ep_tm_screen_Screen_Loggedout .ep_block > a {
    display: none !important;
}

/* ========================================
   LOGOUT PAGE FIX v3 - Hide frontpage link
   ======================================== */

/* Hide the "Go to Homepage" link completely */
body.ep_tm_screen_Screen_Logout p a[href*="/"],
body.ep_tm_screen_Screen_Loggedout p a[href*="/"],
body[class*="Logout"] .main-content > p,
body[class*="Logout"] #ep_messages + p,
body[class*="Logout"] .ep_block + p {
    display: none !important;
}

/* Target specific EPrints generated link */
.main-content p:has(a[href="/"]),
.main-content p:has(a[href*="frontpage"]),
#ep_messages ~ p {
    display: none !important;
}

/* ========================================
   LOGOUT PAGE FIX v4 - Clean card only
   ======================================== */

/* Remove ALL wrappers for logout */
body.ep_tm_screen_Screen_Logout .main-content,
body.ep_tm_screen_Screen_Logout #ep_messages,
body.ep_tm_screen_Screen_Logout .content-area {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
    margin: 0 !important;
}

/* Style ep_msg_message as the clean card */
body.ep_tm_screen_Screen_Logout .ep_msg_message,
.ep_msg_message:has(.modern-logout-container) {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 40px auto !important;
    max-width: 100% !important;
}

/* Ensure logout-card is the only visible card */
body.ep_tm_screen_Screen_Logout .logout-card {
    background: white !important;
    border-radius: 16px !important;
    padding: 40px !important;
    box-shadow: 0 4px 16px rgba(0, 43, 128, 0.12) !important;
    max-width: 500px !important;
    margin: 0 auto !important;
}

/* ========================================
   LOGOUT PAGE FIX v5 - Standalone container
   ======================================== */

/* Hide ALL parent wrappers completely on logout */
body.ep_tm_screen_Screen_Logout .main-wrapper,
body.ep_tm_screen_Screen_Logout .page-header,
body.ep_tm_screen_Screen_Logout .content-area,
body.ep_tm_screen_Screen_Logout .main-content,
body.ep_tm_screen_Screen_Logout #ep_messages,
body.ep_tm_screen_Screen_Logout .ep_msg_message {
    display: contents !important;
}

/* Make modern-logout-container the root visual element */
body.ep_tm_screen_Screen_Logout .modern-logout-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: #F8F9FA !important;
    z-index: 100 !important;
    padding-top: 80px !important;
}

/* Hide footer on logout */
body.ep_tm_screen_Screen_Logout .main-footer {
    display: none !important;
}

/* ========================================
   LOGOUT PAGE FIX FINAL - Remove all wrappers
   ======================================== */

/* Make all wrappers invisible using display:contents */
body.ep_tm_screen_Screen_Logout .main-wrapper,
body.ep_tm_screen_Screen_Logout .page-header,
body.ep_tm_screen_Screen_Logout .content-area,
body.ep_tm_screen_Screen_Logout .main-content,
body.ep_tm_screen_Screen_Logout #ep_messages,
body.ep_tm_screen_Screen_Logout .ep_msg_message,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content > table,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content > table > tbody,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content > table > tbody > tr,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content > table > tbody > tr > td {
    display: contents !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Hide message icon */
body.ep_tm_screen_Screen_Logout .ep_msg_message_icon {
    display: none !important;
}

/* Hide footer on logout */
body.ep_tm_screen_Screen_Logout .main-footer,
body.ep_tm_screen_Screen_Logout .mobile-nav {
    display: none !important;
}

/* Center the logout container */
body.ep_tm_screen_Screen_Logout {
    display: flex !important;
    flex-direction: column !important;
}

body.ep_tm_screen_Screen_Logout .modern-logout-container {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: calc(100vh - 150px) !important;
    padding: 40px 20px !important;
    background: #F8F9FA !important;
}

/* ========================================
   LOGOUT - Remove green message box
   ======================================== */
body.ep_tm_screen_Screen_Logout .ep_msg_message,
body.ep_tm_screen_Screen_Logout .ep_msg_message_content {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.ep_tm_screen_Screen_Logout .ep_msg_message table,
body.ep_tm_screen_Screen_Logout .ep_msg_message tr,
body.ep_tm_screen_Screen_Logout .ep_msg_message td {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

body.ep_tm_screen_Screen_Logout .ep_msg_message_icon,
body.ep_tm_screen_Screen_Logout img.ep_msg_message_icon {
    display: none !important;
}

/* ========================================
   ULTRA MODERN SEARCH RESULTS
   ======================================== */

/* Container reset */
.ep_search_results table,
table.ep_columns {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 16px !important;
    background: transparent !important;
}

.search-result-row-modern {
    background: transparent !important;
}

.search-result-cell-modern {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* Main Card */
.result-card-modern {
    display: flex;
    gap: 20px;
    background: white;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 20px rgba(0, 43, 128, 0.08);
    border: 1px solid #e9ecef;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.result-card-modern::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #0052cc, #0066ff);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.result-card-modern:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 82, 204, 0.15);
    border-color: #0052cc;
}

.result-card-modern:hover::before {
    opacity: 1;
}

/* Left Section */
.result-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-width: 60px;
}

.result-number-badge {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 1.1em;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.3);
}

.result-type-icon {
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0052cc;
    font-size: 1.2em;
}

/* Main Content */
.result-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Tags Row */
.result-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.tag-type {
    padding: 5px 12px;
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white;
    border-radius: 20px;
    font-size: 0.75em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tag-year {
    padding: 5px 12px;
    background: #f8f9fa;
    color: #495057;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid #e9ecef;
}

.tag-published {
    padding: 5px 12px;
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    border-radius: 20px;
    font-size: 0.75em;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* Title */
.result-title-modern {
    margin: 0;
    font-size: 1.25em;
    font-weight: 700;
    line-height: 1.4;
}

.result-title-modern a {
    color: #002b80 !important;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

.result-title-modern a:hover {
    color: #0052cc !important;
}

/* Authors */
.result-authors-modern {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    color: #1a1a1a;
    font-size: 0.95em;
    font-weight: 500;
}

.result-authors-modern i {
    color: #6c757d;
    margin-top: 3px;
    flex-shrink: 0;
}

.result-authors-modern span {
    line-height: 1.5;
}

.result-authors-modern .no-data {
    color: #adb5bd;
    font-style: italic;
}

/* Abstract */
.result-abstract-modern {
    margin: 0;
    color: #6c757d;
    font-size: 0.9em;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding: 12px 16px;
    background: linear-gradient(135deg, #f8f9fa, #ffffff);
    border-radius: 10px;
    border-left: 3px solid #0052cc;
}

/* Metadata Grid */
.result-meta-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}

.meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 0.8em;
    color: #495057;
    font-weight: 500;
    border: 1px solid #e9ecef;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.meta-chip i {
    color: #0052cc;
    flex-shrink: 0;
}

.meta-chip.meta-id {
    background: linear-gradient(135deg, #e8f0fe, #f8f9fa);
    border-color: #c2d6f7;
    color: #0052cc;
}

/* Actions */
.result-actions-modern {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 100px;
}

.action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 0.85em;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.action-view {
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.25);
}

.action-view:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 82, 204, 0.35);
}

.action-download {
    background: linear-gradient(135deg, #10b981, #059669);
    color: white !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
}

.action-download:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.35);
}

.action-link {
    background: #f8f9fa;
    color: #495057 !important;
    border: 1px solid #e9ecef;
}

.action-link:hover {
    background: #e9ecef;
    color: #0052cc !important;
}

/* Responsive */
@media (max-width: 992px) {
    .result-card-modern {
        flex-wrap: wrap;
        padding: 20px;
    }
    
    .result-left {
        flex-direction: row;
        width: 100%;
        justify-content: flex-start;
    }
    
    .result-actions-modern {
        flex-direction: row;
        width: 100%;
        min-width: auto;
    }
    
    .action-btn {
        flex: 1;
    }
}

@media (max-width: 576px) {
    .result-card-modern {
        padding: 16px;
        gap: 12px;
    }
    
    .result-number-badge {
        width: 32px;
        height: 32px;
        font-size: 0.9em;
    }
    
    .result-type-icon {
        width: 36px;
        height: 36px;
    }
    
    .result-title-modern {
        font-size: 1.1em;
    }
    
    .result-abstract-modern {
        padding: 10px 12px;
        font-size: 0.85em;
    }
    
    .meta-chip {
        font-size: 0.75em;
        padding: 4px 8px;
    }
    
    .action-btn span {
        display: none;
    }
    
    .action-btn {
        padding: 10px;
        min-width: 44px;
    }
}

/* Search Page Header Enhancement */
.ep_search_controls {
    background: white;
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: 0 4px 20px rgba(0, 43, 128, 0.08);
}

.ep_search_controls input[type="text"],
.ep_search_controls select {
    border: 2px solid #e9ecef !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    transition: all 0.3s ease !important;
}

.ep_search_controls input[type="text"]:focus,
.ep_search_controls select:focus {
    border-color: #0052cc !important;
    box-shadow: 0 0 0 4px rgba(0, 82, 204, 0.1) !important;
}

/* Results Count */
.ep_search_results_count {
    background: linear-gradient(135deg, #002b80, #0052cc);
    color: white;
    padding: 16px 24px;
    border-radius: 12px;
    margin-bottom: 20px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
}

.ep_search_results_count::before {
    content: '\f002';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

/* Pagination */
.ep_search_page_controls {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.ep_search_page_controls a,
.ep_search_page_controls span {
    padding: 10px 16px;
    border-radius: 10px;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.3s ease;
}

.ep_search_page_controls a {
    background: white;
    color: #0052cc !important;
    border: 2px solid #e9ecef;
}

.ep_search_page_controls a:hover {
    background: #0052cc;
    color: white !important;
    border-color: #0052cc;
}

.ep_search_page_controls span.ep_search_page_current {
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white;
    border: 2px solid #0052cc;
}

/* Fix for action button with nested link */
.action-btn.action-view a {
    color: white !important;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.action-btn.action-view {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ========================================
   SEARCH RESULT PAGE - Clean & Compact
   ======================================== */

/* Remove main-content wrapper for search results */
body[class*="Search"] .main-content,
body[class*="search"] .main-content {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Hide ep_search_controls (refine, reorder) at top */
.ep_search_controls {
    display: none !important;
}

/* Hide ep_search_export section at top */
.ep_search_export {
    display: none !important;
}

/* Style ep_search_results directly */
.ep_search_results {
    background: transparent !important;
    padding: 0 !important;
}

.ep_search_results table.ep_paginate_list {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 12px !important;
}

/* Compact result card */
.result-card-modern {
    background: white !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
    display: flex !important;
    gap: 15px !important;
    transition: all 0.2s ease !important;
    border: 1px solid #e9ecef !important;
}

.result-card-modern:hover {
    box-shadow: 0 4px 16px rgba(0, 43, 128, 0.12) !important;
    border-color: #0052cc !important;
}

/* Compact left section */
.result-left {
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}

.result-number-badge {
    width: 32px !important;
    height: 32px !important;
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 0.9em !important;
}

.result-type-icon {
    width: 32px !important;
    height: 32px !important;
    background: #f0f4ff !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0052cc !important;
    font-size: 0.9em !important;
}

/* Compact main content */
.result-main {
    flex: 1 !important;
    min-width: 0 !important;
}

.result-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
}

.result-tags span {
    font-size: 0.75em !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}

.tag-type {
    background: #e8f4fd !important;
    color: #0052cc !important;
    font-weight: 600 !important;
}

.tag-year {
    background: #f8f9fa !important;
    color: #6c757d !important;
}

.tag-published {
    background: #d4edda !important;
    color: #155724 !important;
}

.result-title-modern {
    font-size: 1.05em !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.4 !important;
}

.result-title-modern a {
    color: #002b80 !important;
    text-decoration: none !important;
}

.result-title-modern a:hover {
    color: #0052cc !important;
}

.result-authors-modern {
    font-size: 0.85em !important;
    color: #6c757d !important;
    margin-bottom: 8px !important;
}

.result-abstract-modern {
    font-size: 0.85em !important;
    color: #6c757d !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.5 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.result-meta-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.meta-chip {
    font-size: 0.75em !important;
    background: #f8f9fa !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    color: #6c757d !important;
}

.meta-chip a {
    color: #0052cc !important;
    text-decoration: none !important;
}

/* Compact actions */
.result-actions-modern {
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.action-btn {
    padding: 8px 12px !important;
    border-radius: 6px !important;
    font-size: 0.8em !important;
    font-weight: 600 !important;
    text-align: center !important;
}

.action-view {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
}

.action-view a {
    color: white !important;
    text-decoration: none !important;
}

/* Move pagination to bottom - style it */
.ep_paginate_list + .ep_search_controls,
.ep_search_results ~ .ep_search_controls {
    display: block !important;
    margin-top: 20px !important;
    text-align: center !important;
    padding: 15px !important;
    background: white !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
}

/* Hide page header for search */
body[class*="Search"] .page-header {
    display: none !important;
}

/* Responsive */
@media (max-width: 768px) {
    .result-card-modern {
        flex-direction: column !important;
        padding: 15px !important;
    }
    
    .result-left {
        flex-direction: row !important;
    }
    
    .result-actions-modern {
        flex-direction: row !important;
        justify-content: flex-start !important;
    }
}

/* ========================================
   SEARCH RESULT PAGE v2 - More Compact
   ======================================== */

/* Remove ALL wrappers */
body[class*="Search"] .content-area {
    padding: 15px !important;
}

body[class*="Search"] .main-content {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
}

/* Result card - more compact */
.result-card-modern {
    background: white !important;
    border-radius: 10px !important;
    padding: 15px !important;
    box-shadow: 0 1px 4px rgba(0, 43, 128, 0.06) !important;
    display: flex !important;
    gap: 12px !important;
    border: 1px solid #e9ecef !important;
    margin-bottom: 10px !important;
}

.result-card-modern:hover {
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.1) !important;
    border-color: #0052cc !important;
}

/* Smaller left section */
.result-left {
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
}

.result-number-badge {
    width: 28px !important;
    height: 28px !important;
    font-size: 0.8em !important;
}

.result-type-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 0.8em !important;
}

/* Compact tags */
.result-tags {
    gap: 6px !important;
    margin-bottom: 6px !important;
}

.result-tags span {
    font-size: 0.7em !important;
    padding: 2px 6px !important;
}

/* Compact title */
.result-title-modern {
    font-size: 0.95em !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
}

/* Hide authors section - move to meta grid */
.result-authors-modern {
    display: none !important;
}

/* Abstract right after title */
.result-abstract-modern {
    font-size: 0.8em !important;
    margin: 0 0 8px 0 !important;
    -webkit-line-clamp: 2 !important;
    color: #555 !important;
}

/* Meta grid - include authors, more compact */
.result-meta-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: flex-start !important;
}

.meta-chip {
    font-size: 0.7em !important;
    padding: 3px 6px !important;
    border-radius: 4px !important;
    background: #f5f7fa !important;
    display: inline-flex !important;
    align-items: flex-start !important;
    gap: 4px !important;
    max-width: 100% !important;
}

.meta-chip i {
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

/* Fix subject with multiple items - show only first, hide br */
.meta-chip br {
    display: none !important;
}

.meta-chip a {
    color: #0052cc !important;
    text-decoration: none !important;
}

/* Truncate long subject text */
.meta-chip a {
    display: inline !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 200px !important;
}

/* Show only first subject link */
.meta-chip a:not(:first-of-type) {
    display: none !important;
}

/* Compact actions */
.result-actions-modern {
    flex-shrink: 0 !important;
    align-self: center !important;
}

.action-btn {
    padding: 6px 10px !important;
    font-size: 0.75em !important;
}

/* Add author chip to meta grid via CSS */
.result-main::before {
    content: none !important;
}

/* Table spacing */
.ep_search_results table.ep_paginate_list {
    border-spacing: 0 !important;
}

.search-result-row-modern td {
    padding: 0 !important;
    border: none !important;
}

.search-result-cell-modern {
    padding: 5px 0 !important;
}

/* Responsive */
@media (max-width: 768px) {
    .result-card-modern {
        padding: 12px !important;
        gap: 10px !important;
    }
    
    .meta-chip a {
        max-width: 150px !important;
    }
}

/* ========================================
   META CHIPS - Clean & Organized
   ======================================== */

/* Author chip */
.meta-chip.meta-author {
    background: #e8f4fd !important;
    color: #0052cc !important;
}

.meta-chip.meta-author .person_name {
    color: #0052cc !important;
}

/* Division chip */
.meta-chip.meta-division {
    background: #fff3e0 !important;
    color: #e65100 !important;
}

.meta-chip.meta-division a {
    color: #e65100 !important;
}

/* Subject chip - clean up multiple subjects */
.meta-chip.meta-subject {
    background: #f3e5f5 !important;
    color: #7b1fa2 !important;
    max-width: 300px !important;
    overflow: hidden !important;
}

.meta-chip.meta-subject a {
    color: #7b1fa2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Hide all but first subject link */
.meta-chip.meta-subject br,
.meta-chip.meta-subject br + a {
    display: none !important;
}

/* Truncate long division text */
.meta-chip.meta-division a {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 250px !important;
    display: inline-block !important;
}

/* Person name styling */
.meta-chip .person_name {
    font-weight: 500 !important;
}

/* Multiple authors - show first only */
.meta-chip.meta-author .person_name ~ .person_name::before {
    content: ", " !important;
}

/* Limit visible authors */
.meta-chip.meta-author {
    max-width: 250px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* ========================================
   SEARCH RESULT - Remove ALL Wrappers
   ======================================== */

/* Remove main-content wrapper completely */
body[class*="Search"] .main-content {
    display: contents !important;
}

body[class*="Search"] .content-area {
    padding: 10px !important;
    max-width: 100% !important;
}

body[class*="Search"] .page-header {
    display: none !important;
}

body[class*="Search"] #ep_messages:empty {
    display: none !important;
}

/* ========================================
   MOBILE - Ultra Compact
   ======================================== */
@media (max-width: 768px) {
    body[class*="Search"] .content-area {
        padding: 8px !important;
    }
    
    /* Ultra compact card */
    .result-card-modern {
        padding: 10px !important;
        gap: 8px !important;
        border-radius: 8px !important;
        margin-bottom: 8px !important;
    }
    
    /* Hide left section on mobile */
    .result-left {
        display: none !important;
    }
    
    /* Compact tags */
    .result-tags {
        gap: 4px !important;
        margin-bottom: 4px !important;
    }
    
    .result-tags span {
        font-size: 0.65em !important;
        padding: 2px 5px !important;
    }
    
    /* Compact title */
    .result-title-modern {
        font-size: 0.9em !important;
        margin: 0 0 4px 0 !important;
        line-height: 1.25 !important;
    }
    
    /* Shorter abstract */
    .result-abstract-modern {
        font-size: 0.75em !important;
        margin: 0 0 6px 0 !important;
        -webkit-line-clamp: 2 !important;
    }
    
    /* Compact meta grid */
    .result-meta-grid {
        gap: 4px !important;
    }
    
    .meta-chip {
        font-size: 0.65em !important;
        padding: 2px 5px !important;
        max-width: 100% !important;
    }
    
    .meta-chip.meta-author,
    .meta-chip.meta-division,
    .meta-chip.meta-subject {
        max-width: 100% !important;
    }
    
    .meta-chip a,
    .meta-chip .person_name {
        max-width: 180px !important;
    }
    
    /* Inline action button */
    .result-actions-modern {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
    }
    
    .result-card-modern {
        position: relative !important;
    }
    
    .action-btn {
        padding: 4px 8px !important;
        font-size: 0.7em !important;
    }
    
    .action-btn span {
        display: none !important;
    }
}

/* Extra small screens */
@media (max-width: 480px) {
    body[class*="Search"] .content-area {
        padding: 5px !important;
    }
    
    .result-card-modern {
        padding: 8px !important;
        margin-bottom: 6px !important;
    }
    
    .result-tags span {
        font-size: 0.6em !important;
    }
    
    .result-title-modern {
        font-size: 0.85em !important;
        padding-right: 30px !important;
    }
    
    .result-abstract-modern {
        font-size: 0.7em !important;
        -webkit-line-clamp: 1 !important;
    }
    
    .meta-chip {
        font-size: 0.6em !important;
    }
    
    .meta-chip a,
    .meta-chip .person_name {
        max-width: 140px !important;
    }
}

/* ========================================
   SEARCH RESULT - NO WRAPPERS AT ALL
   ======================================== */

/* Remove ALL wrappers - result card langsung di atas */
body[class*="Search"] .main-wrapper,
body[class*="Search"] .content-area,
body[class*="Search"] .main-content,
body[class*="Search"] .ep_search_results,
body[class*="Search"] .ep_search_results > table,
body[class*="Search"] .ep_search_results > table > tbody,
body[class*="Search"] .search-result-row-modern,
body[class*="Search"] .search-result-cell-modern {
    display: contents !important;
}

/* Hide page header */
body[class*="Search"] .page-header {
    display: none !important;
}

/* Result cards container - add padding to body instead */
body[class*="Search"] {
    padding-top: 10px !important;
}

/* Result card styling - standalone */
body[class*="Search"] .result-card-modern {
    margin: 0 10px 10px 10px !important;
}

/* ========================================
   RESULT CARD - Visible Background
   ======================================== */

.result-card-modern {
    background: #ffffff !important;
    border: 1px solid #e0e5ec !important;
    box-shadow: 0 2px 6px rgba(0, 43, 128, 0.08) !important;
}

.result-card-modern:hover {
    background: #fafbfc !important;
    border-color: #0052cc !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.15) !important;
}

/* Ensure text is readable */
.result-title-modern a {
    color: #1a1a2e !important;
}

.result-title-modern a:hover {
    color: #0052cc !important;
}

.result-abstract-modern {
    color: #4a4a5a !important;
}

.result-tags .tag-type {
    background: #e3f2fd !important;
    color: #1565c0 !important;
}

.result-tags .tag-year {
    background: #f5f5f5 !important;
    color: #555 !important;
}

.result-tags .tag-published {
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
}

/* ========================================
   RESULT CARD - Soft Blue Tint
   ======================================== */

.result-card-modern {
    background: linear-gradient(135deg, #f8faff 0%, #f0f5ff 100%) !important;
    border: 1px solid #d4e3f7 !important;
    box-shadow: 0 2px 8px rgba(0, 82, 204, 0.08) !important;
}

.result-card-modern:hover {
    background: linear-gradient(135deg, #ffffff 0%, #f5f9ff 100%) !important;
    border-color: #0052cc !important;
    box-shadow: 0 4px 16px rgba(0, 82, 204, 0.15) !important;
}

/* RESULT CARD - Stronger Blue Tint */
.result-card-modern {
    background: linear-gradient(135deg, #f0f6ff 0%, #e6efff 100%) !important;
    border: 1px solid #c5d9f7 !important;
}

.result-card-modern:hover {
    background: linear-gradient(135deg, #f8faff 0%, #eef4ff 100%) !important;
}

/* ========================================
   MOBILE RESULT CARD - Redesign
   ======================================== */
@media (max-width: 768px) {
    /* Show left section with number */
    .result-left {
        display: flex !important;
        flex-direction: row !important;
        gap: 6px !important;
    }
    
    .result-number-badge {
        width: 24px !important;
        height: 24px !important;
        font-size: 0.7em !important;
    }
    
    .result-type-icon {
        width: 24px !important;
        height: 24px !important;
        font-size: 0.7em !important;
    }
    
    /* Card layout */
    .result-card-modern {
        flex-direction: column !important;
        padding: 12px !important;
        position: relative !important;
    }
    
    /* Limit title length */
    .result-title-modern {
        font-size: 0.85em !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        line-height: 1.3 !important;
        margin: 0 0 6px 0 !important;
    }
    
    /* Hide abstract on mobile */
    .result-abstract-modern {
        display: none !important;
    }
    
    /* Compact tags */
    .result-tags {
        margin-bottom: 6px !important;
    }
    
    /* Meta grid compact */
    .result-meta-grid {
        gap: 4px !important;
        margin-bottom: 8px !important;
    }
    
    /* View button at bottom */
    .result-actions-modern {
        position: static !important;
        width: 100% !important;
        margin-top: 8px !important;
    }
    
    .action-btn {
        width: 100% !important;
        justify-content: center !important;
        padding: 8px !important;
        font-size: 0.75em !important;
    }
    
    .action-btn span {
        display: inline !important;
    }
}

@media (max-width: 480px) {
    .result-card-modern {
        padding: 10px !important;
        margin: 0 5px 8px 5px !important;
    }
    
    .result-title-modern {
        font-size: 0.8em !important;
        -webkit-line-clamp: 2 !important;
    }
    
    .result-tags span {
        font-size: 0.6em !important;
        padding: 2px 4px !important;
    }
    
    .meta-chip {
        font-size: 0.6em !important;
    }
}

/* ========================================
   MOBILE - Tags inline with number
   ======================================== */
@media (max-width: 768px) {
    /* Top row: number, icon, tags in one line */
    .result-card-modern {
        display: flex !important;
        flex-direction: column !important;
    }
    
    /* Create header row */
    .result-left {
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        float: left !important;
        margin-right: 8px !important;
    }
    
    .result-tags {
        display: inline-flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 4px !important;
        margin-bottom: 8px !important;
    }
    
    /* Clear float after tags */
    .result-title-modern {
        clear: both !important;
    }
}

@media (max-width: 480px) {
    .result-left {
        margin-right: 6px !important;
    }
    
    .result-number-badge,
    .result-type-icon {
        width: 22px !important;
        height: 22px !important;
        font-size: 0.65em !important;
    }
}

/* ========================================
   RESULT CARD - Header Row Layout
   ======================================== */

/* Header row: Number + Type + Date + Status */
.result-header-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    margin-bottom: 10px !important;
}

.result-header-row .result-number-badge {
    width: 28px !important;
    height: 28px !important;
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 0.8em !important;
    flex-shrink: 0 !important;
}

.result-header-row .tag-type,
.result-header-row .tag-year,
.result-header-row .tag-published {
    font-size: 0.75em !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.result-header-row .tag-type {
    background: #e3f2fd !important;
    color: #1565c0 !important;
    font-weight: 600 !important;
}

.result-header-row .tag-year {
    background: #f5f5f5 !important;
    color: #555 !important;
}

.result-header-row .tag-published {
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
}

/* Hide old result-left and result-tags */
.result-left,
.result-tags {
    display: none !important;
}

/* Desktop layout */
.result-card-modern {
    display: flex !important;
    flex-direction: column !important;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .result-header-row {
        gap: 6px !important;
        margin-bottom: 8px !important;
    }
    
    .result-header-row .result-number-badge {
        width: 24px !important;
        height: 24px !important;
        font-size: 0.7em !important;
    }
    
    .result-header-row .tag-type,
    .result-header-row .tag-year,
    .result-header-row .tag-published {
        font-size: 0.65em !important;
        padding: 3px 6px !important;
    }
}

@media (max-width: 480px) {
    .result-header-row .result-number-badge {
        width: 22px !important;
        height: 22px !important;
        font-size: 0.65em !important;
    }
    
    .result-header-row .tag-type,
    .result-header-row .tag-year,
    .result-header-row .tag-published {
        font-size: 0.6em !important;
        padding: 2px 5px !important;
    }
}

/* ========================================
   DESKTOP - View button top right
   ======================================== */
@media (min-width: 769px) {
    .result-card-modern {
        position: relative !important;
    }
    
    .result-actions-modern {
        position: absolute !important;
        top: 15px !important;
        right: 15px !important;
        margin: 0 !important;
    }
    
    .action-btn {
        padding: 6px 12px !important;
        font-size: 0.75em !important;
    }
    
    /* Give header row space for button */
    .result-header-row {
        padding-right: 80px !important;
    }
}

/* ========================================
   PAGINATION & CONTROLS - Modern Design
   ======================================== */

/* Show bottom controls */
.ep_search_controls_bottom {
    display: block !important;
    background: white !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin: 15px 10px !important;
    box-shadow: 0 2px 8px rgba(0, 43, 128, 0.08) !important;
    border: 1px solid #e0e5ec !important;
}

.ep_search_controls_bottom > div {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

/* Hide "Displaying results" text and br */
.ep_search_controls_bottom > div > br {
    display: none !important;
}

/* Style result count */
.ep_search_controls_bottom .ep_search_number {
    font-weight: 700 !important;
    color: #0052cc !important;
}

/* Style control links */
.ep_search_controls_bottom .ep_search_control {
    display: inline-flex !important;
    align-items: center !important;
}

.ep_search_controls_bottom .ep_search_control a {
    padding: 8px 14px !important;
    background: #f0f6ff !important;
    color: #0052cc !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 0.85em !important;
    transition: all 0.2s ease !important;
    border: 1px solid #d4e3f7 !important;
}

.ep_search_controls_bottom .ep_search_control a:hover {
    background: #0052cc !important;
    color: white !important;
}

/* Current page number */
.ep_search_controls_bottom .ep_search_control strong {
    padding: 8px 14px !important;
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 0.85em !important;
}

/* Hide pipe separators */
.ep_search_controls_bottom > div {
    font-size: 0 !important;
}

.ep_search_controls_bottom .ep_search_control,
.ep_search_controls_bottom .ep_search_number {
    font-size: 14px !important;
}

/* Hide reorder section in bottom */
.ep_search_controls_bottom .ep_search_reorder {
    display: none !important;
}

/* Hide refine/new search in bottom - keep only pagination */
.ep_search_controls_bottom .ep_search_control:first-of-type,
.ep_search_controls_bottom .ep_search_control:nth-of-type(2) {
    display: none !important;
}

/* Mobile */
@media (max-width: 768px) {
    .ep_search_controls_bottom {
        padding: 12px 15px !important;
        margin: 10px 5px !important;
    }
    
    .ep_search_controls_bottom .ep_search_control a,
    .ep_search_controls_bottom .ep_search_control strong {
        padding: 6px 10px !important;
        font-size: 0.8em !important;
    }
}

/* ========================================
   SUMMARY PAGE - Ultra Modern Design
   ======================================== */

/* Remove empty wrapper divs */
.ep_summary_content_left,
.ep_summary_content_right,
.ep_summary_content_top,
.ep_summary_content_bottom,
.ep_summary_content_after {
    display: none !important;
}

/* Main summary container */
.ep_summary_content {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 43, 128, 0.08) !important;
    padding: 0 !important;
    margin: 20px auto !important;
    max-width: 900px !important;
    overflow: hidden !important;
}

/* ============================================
   ULTRA MODERN SUMMARY PAGE STYLES
   ============================================ */

/* Hide EPrints default wrappers */
.ep_summary_content_left,
.ep_summary_content_right,
.ep_summary_content_top,
.ep_summary_content_bottom,
.ep_summary_content_after { display: none !important; }
.ep_summary_content { display: contents !important; }
.ep_summary_content_main { display: contents !important; }

/* Main Container */
.sp-container {
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Hero Section */
.sp-hero {
    background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%) !important;
    padding: 40px 30px !important;
    border-radius: 20px !important;
    margin-bottom: 20px !important;
    position: relative !important;
    overflow: hidden !important;
}
.sp-hero::before {
    content: '' !important;
    position: absolute !important;
    top: -50% !important;
    right: -20% !important;
    width: 400px !important;
    height: 400px !important;
    background: radial-gradient(circle, rgba(99,102,241,0.15) 0%, transparent 70%) !important;
    pointer-events: none !important;
}

.sp-type-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: rgba(255,255,255,0.1) !important;
    backdrop-filter: blur(10px) !important;
    padding: 8px 16px !important;
    border-radius: 30px !important;
    font-size: 0.8em !important;
    color: #94a3b8 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 16px !important;
}
.sp-type-badge i { color: #818cf8 !important; }
.sp-status {
    background: #22c55e !important;
    color: white !important;
    padding: 2px 10px !important;
    border-radius: 12px !important;
    font-size: 0.85em !important;
    margin-left: 8px !important;
}

.sp-title {
    font-size: 1.8em !important;
    font-weight: 700 !important;
    color: white !important;
    line-height: 1.3 !important;
    margin: 0 0 16px 0 !important;
}

.sp-authors {
    color: #cbd5e1 !important;
    font-size: 1em !important;
    margin-bottom: 16px !important;
}
.sp-authors .person_name { color: #e2e8f0 !important; font-weight: 500 !important; }

.sp-meta-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}
.sp-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: rgba(255,255,255,0.08) !important;
    padding: 6px 14px !important;
    border-radius: 20px !important;
    font-size: 0.85em !important;
    color: #94a3b8 !important;
}
.sp-chip i { font-size: 0.9em !important; }
.sp-chip-div { background: rgba(99,102,241,0.2) !important; color: #a5b4fc !important; }

/* Quick Actions */
.sp-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-bottom: 20px !important;
}
.sp-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 20px !important;
    border-radius: 12px !important;
    font-size: 0.9em !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    border: none !important;
}
.sp-btn-primary {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
    color: white !important;
    box-shadow: 0 4px 15px rgba(99,102,241,0.3) !important;
}
.sp-btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(99,102,241,0.4) !important;
}
.sp-btn-outline {
    background: white !important;
    color: #475569 !important;
    border: 1px solid #e2e8f0 !important;
}
.sp-btn-outline:hover { background: #f8fafc !important; border-color: #cbd5e1 !important; }

/* Sections */
.sp-section {
    background: white !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    margin-bottom: 16px !important;
    overflow: hidden !important;
}
.sp-section-head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    background: #f8fafc !important;
    font-weight: 600 !important;
    color: #334155 !important;
    font-size: 0.95em !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.sp-section-head i { color: #6366f1 !important; }
.sp-count {
    background: #6366f1 !important;
    color: white !important;
    padding: 2px 10px !important;
    border-radius: 12px !important;
    font-size: 0.8em !important;
    margin-left: auto !important;
}

/* Files - Horizontal Scroll */
.sp-files-scroll {
    display: flex !important;
    gap: 12px !important;
    padding: 16px 20px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
}
.sp-files-scroll::-webkit-scrollbar { height: 6px !important; }
.sp-files-scroll::-webkit-scrollbar-track { background: #f1f5f9 !important; border-radius: 3px !important; }
.sp-files-scroll::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 3px !important; }

.sp-file-chip {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 16px !important;
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%) !important;
    border: 1px solid #fecaca !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    scroll-snap-align: start !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}
.sp-file-chip:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(239,68,68,0.15) !important;
    border-color: #f87171 !important;
}
.sp-file-chip i { color: #dc2626 !important; font-size: 1.2em !important; }
.sp-file-name { color: #1e293b !important; font-weight: 600 !important; font-size: 0.9em !important; max-width: 180px !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.sp-file-size { color: #64748b !important; font-size: 0.75em !important; background: white !important; padding: 3px 8px !important; border-radius: 6px !important; }

.sp-no-files {
    padding: 20px !important;
    background: #fffbeb !important;
    border: 1px solid #fde68a !important;
    border-radius: 12px !important;
    color: #92400e !important;
    text-align: center !important;
    margin-bottom: 16px !important;
}
.sp-no-files i { margin-right: 8px !important; }

/* Abstract - Collapsible */
.sp-abstract-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    background: #f8fafc !important;
    border: none !important;
    cursor: pointer !important;
    font-size: 0.95em !important;
    font-weight: 600 !important;
    color: #334155 !important;
    transition: all 0.2s ease !important;
}
.sp-abstract-btn:hover { background: #f1f5f9 !important; }
.sp-abstract-btn span { display: flex !important; align-items: center !important; gap: 10px !important; }
.sp-abstract-btn i:first-child { color: #6366f1 !important; }
.sp-chevron { transition: transform 0.3s ease !important; color: #94a3b8 !important; }
.sp-abstract.open .sp-chevron { transform: rotate(180deg) !important; }

.sp-abstract-body {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.4s ease !important;
    padding: 0 20px !important;
}
.sp-abstract.open .sp-abstract-body {
    max-height: 2000px !important;
    padding: 20px !important;
    border-top: 1px solid #e2e8f0 !important;
}
.sp-abstract-body {
    color: #475569 !important;
    line-height: 1.8 !important;
    text-align: justify !important;
}

/* Metadata Grid */
.sp-meta-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1px !important;
    background: #e2e8f0 !important;
}
.sp-meta-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    padding: 14px 20px !important;
    background: white !important;
}
.sp-meta-item label {
    font-size: 0.75em !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #64748b !important;
    font-weight: 600 !important;
}
.sp-meta-item span { color: #1e293b !important; font-size: 0.9em !important; word-break: break-word !important; }
.sp-meta-item a { color: #6366f1 !important; text-decoration: none !important; }
.sp-meta-item a:hover { text-decoration: underline !important; }
.sp-meta-full { grid-column: span 2 !important; }

/* Stats */
.sp-stats { padding-bottom: 20px !important; }
.sp-stats #irstats2_summary_page_downloads { padding: 20px !important; }

/* Register page styles moved to zzz_register.css */

/* ============================================
   LATEST PAGE STYLES
   ============================================ */
.ep_latest_list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 10px !important;
}
.ep_latest_result {
    display: contents !important;
}
.ep_latest_list h2 {
    font-size: 1em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    margin: 20px 10px 10px 10px !important;
    padding-bottom: 8px !important;
    border-bottom: 2px solid #e2e8f0 !important;
}
.ep_latest_list h2:first-child {
    margin-top: 0 !important;
}

/* Mobile */
@media (max-width: 768px) {
    .sp-hero { padding: 24px 20px !important; border-radius: 16px !important; }
    .sp-title { font-size: 1.3em !important; }
    .sp-actions { flex-direction: column !important; }
    .sp-btn { justify-content: center !important; }
    .sp-meta-grid { grid-template-columns: 1fr !important; }
    .sp-meta-full { grid-column: span 1 !important; }
    .sp-file-chip { min-width: 200px !important; }
}

/* ========================================
   SUMMARY PAGE v2 - Modern Redesign
   ======================================== */

/* Wrapper */
.sp-wrapper {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 20px !important;
}

/* Breadcrumb */
.sp-breadcrumb {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 0.85em !important;
    color: #6c757d !important;
    margin-bottom: 20px !important;
}

.sp-breadcrumb a {
    color: #0052cc !important;
    text-decoration: none !important;
}

.sp-breadcrumb i.fa-chevron-right {
    font-size: 0.7em !important;
    color: #adb5bd !important;
}

/* Grid Layout */
.sp-grid {
    display: grid !important;
    grid-template-columns: 1fr 380px !important;
    gap: 24px !important;
    align-items: start !important;
}

/* Main Column */
.sp-main {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* Badge */
.sp-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 16px !important;
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border-radius: 30px !important;
    font-size: 0.85em !important;
    font-weight: 600 !important;
    width: fit-content !important;
}

.sp-badge i {
    font-size: 1em !important;
}

.sp-pub-status {
    background: rgba(255,255,255,0.2) !important;
    padding: 2px 10px !important;
    border-radius: 20px !important;
    font-size: 0.85em !important;
}

/* Title */
.sp-title {
    font-size: 1.8em !important;
    font-weight: 700 !important;
    color: #002b80 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

/* Authors */
.sp-authors {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: 1.05em !important;
    color: #1a1a1a !important;
}

.sp-authors i {
    color: #6c757d !important;
    margin-top: 4px !important;
}

.sp-authors .person_name {
    color: #1a1a1a !important;
    font-weight: 500 !important;
}

/* Pills */
.sp-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.sp-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 14px !important;
    background: #f0f4f8 !important;
    border-radius: 20px !important;
    font-size: 0.85em !important;
    color: #495057 !important;
    font-weight: 500 !important;
}

.sp-pill i {
    color: #6c757d !important;
}

.sp-pill-primary {
    background: #e8f4fd !important;
    color: #0052cc !important;
}

.sp-pill-primary i {
    color: #0052cc !important;
}

/* Cards */
.sp-card {
    background: white !important;
    border-radius: 12px !important;
    border: 1px solid #e9ecef !important;
    overflow: hidden !important;
}

.sp-card-header {
    padding: 14px 20px !important;
    background: #f8f9fa !important;
    border-bottom: 1px solid #e9ecef !important;
    font-weight: 600 !important;
    color: #002b80 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.sp-card-header i {
    color: #0052cc !important;
}

.sp-card-body {
    padding: 20px !important;
}

.sp-card-accent {
    border-color: #0052cc !important;
}

.sp-card-accent .sp-card-header {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    border-bottom: none !important;
}

.sp-card-accent .sp-card-header i {
    color: white !important;
}

/* Abstract */
.sp-abstract-text {
    color: #495057 !important;
    line-height: 1.7 !important;
    font-size: 0.95em !important;
}

/* Details Grid */
.sp-details {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
}

.sp-detail {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.sp-detail-full {
    grid-column: span 2 !important;
}

.sp-label {
    font-size: 0.75em !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #6c757d !important;
}

.sp-value {
    color: #1a1a1a !important;
    font-size: 0.9em !important;
}

.sp-keywords {
    line-height: 1.6 !important;
}

/* Sidebar */
.sp-sidebar {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    position: sticky !important;
    top: 100px !important;
}

/* Files Grid - HORIZONTAL CARDS */
.sp-files-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

.sp-file-card {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    background: linear-gradient(135deg, #f8faff, #f0f5ff) !important;
    border: 1px solid #d4e3f7 !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.sp-file-card:hover {
    background: linear-gradient(135deg, #eef4ff, #e6efff) !important;
    border-color: #0052cc !important;
    transform: translateX(4px) !important;
}

.sp-file-icon {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(135deg, #dc2626, #ef4444) !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.sp-file-icon i {
    color: white !important;
    font-size: 1.1em !important;
}

.sp-file-info {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.sp-file-name {
    color: #1a1a1a !important;
    font-weight: 600 !important;
    font-size: 0.85em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sp-file-meta {
    color: #6c757d !important;
    font-size: 0.75em !important;
}

.sp-file-dl {
    color: #0052cc !important;
    font-size: 0.9em !important;
    opacity: 0.5 !important;
    transition: opacity 0.2s ease !important;
}

.sp-file-card:hover .sp-file-dl {
    opacity: 1 !important;
}

/* No Files */
.sp-no-files {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 30px !important;
    color: #adb5bd !important;
    text-align: center !important;
}

.sp-no-files i {
    font-size: 2em !important;
}

/* Actions */
.sp-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.sp-action-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 16px !important;
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 8px !important;
    color: #495057 !important;
    font-size: 0.85em !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.sp-action-btn:hover {
    background: #e9ecef !important;
    color: #0052cc !important;
}

/* Exports */
.sp-exports {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.sp-export-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 6px !important;
    color: #495057 !important;
    font-size: 0.8em !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.sp-export-btn:hover {
    background: #0052cc !important;
    color: white !important;
    border-color: #0052cc !important;
}

/* Responsive */
@media (max-width: 992px) {
    .sp-grid {
        grid-template-columns: 1fr !important;
    }
    
    .sp-sidebar {
        position: static !important;
    }
}

@media (max-width: 768px) {
    .sp-wrapper {
        padding: 15px !important;
    }
    
    .sp-title {
        font-size: 1.4em !important;
    }
    
    .sp-details {
        grid-template-columns: 1fr !important;
    }
    
    .sp-detail-full {
        grid-column: span 1 !important;
    }
    
    .sp-breadcrumb {
        font-size: 0.8em !important;
        flex-wrap: wrap !important;
    }
}

@media (max-width: 480px) {
    .sp-wrapper {
        padding: 10px !important;
    }
    
    .sp-title {
        font-size: 1.2em !important;
    }
    
    .sp-card-body {
        padding: 15px !important;
    }
    
    .sp-file-card {
        padding: 10px 12px !important;
    }
}


/* Breadcrumb fix - nested links */
.sp-breadcrumb-div a {
    color: #0052cc !important;
    text-decoration: none !important;
}

.sp-breadcrumb-div a:hover {
    text-decoration: underline !important;
}

/* Pills - hide SVG badges from thesis_type */
.sp-pill svg,
.sp-pill a[style*="inline-flex"] {
    display: none !important;
}

.sp-pills .sp-pill-primary a {
    color: #0052cc !important;
    text-decoration: none !important;
}

/* Details - clean up thesis type SVG */
.sp-value svg,
.sp-value a[style*="inline-flex"] {
    display: none !important;
}

/* Subjects - better display */
.sp-value a {
    color: #0052cc !important;
    text-decoration: none !important;
}

.sp-value a:hover {
    text-decoration: underline !important;
}

.sp-value br {
    display: block !important;
    margin-bottom: 4px !important;
}


/* Summary Page Cards - Blue Tint */
.sp-card {
    background: linear-gradient(135deg, #f8faff 0%, #f0f5ff 100%) !important;
    border-color: #d4e3f7 !important;
}

.sp-card-header {
    background: linear-gradient(135deg, #e8f0fe 0%, #dbe7fc 100%) !important;
    border-bottom-color: #c5d9f7 !important;
}

.sp-card-accent {
    background: linear-gradient(135deg, #f0f6ff 0%, #e6efff 100%) !important;
}


/* Summary Page - Main Content Blue Tint */
.main-content:has(.sp-wrapper) {
    background: linear-gradient(135deg, #e3edfc 0%, #d9e6fa 100%) !important;
    border: 1px solid #b8d0f0 !important;
}

/* Inner cards - white with subtle shadow for contrast */
.sp-wrapper .sp-card {
    background: white !important;
    border: 1px solid #c5d9f7 !important;
    box-shadow: 0 2px 8px rgba(0, 82, 204, 0.1) !important;
}

.sp-wrapper .sp-card-header {
    background: linear-gradient(135deg, #f0f6ff 0%, #e8f1ff 100%) !important;
    border-bottom: 1px solid #d4e3f7 !important;
}

.sp-wrapper .sp-card-accent {
    border-color: #0052cc !important;
}

.sp-wrapper .sp-card-accent .sp-card-header {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
}


/* Statistics Card - Modern Styling */
.sp-card-body .irstats2_summary_page_header {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.9em !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    margin: 0 0 15px 0 !important;
    box-shadow: 0 2px 8px rgba(0, 82, 204, 0.25) !important;
}

.sp-card-body #irstats2_summary_page_downloads {
    min-height: 150px !important;
    padding: 10px !important;
    background: #f8faff !important;
    border-radius: 8px !important;
    margin-bottom: 10px !important;
}

.sp-card-body #irstats2_summary_page_downloads svg,
.sp-card-body #irstats2_summary_page_downloads div {
    max-width: 100% !important;
}

.sp-card-body a#irstats2_summary_page\:link,
.sp-card-body a[id*="irstats2"] {
    background: linear-gradient(135deg, #0052cc, #0066ff) !important;
    color: white !important;
    padding: 8px 16px !important;
    border: none !important;
    border-radius: 8px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.8em !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 6px rgba(0, 82, 204, 0.2) !important;
}

.sp-card-body a#irstats2_summary_page\:link:hover,
.sp-card-body a[id*="irstats2"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 82, 204, 0.3) !important;
}

/* Hide old styled elements */
.sp-card-body > div[style*="border: none"] {
    border: none !important;
    margin: 0 !important;
}

.sp-card-body span[style*="font-family: 'Ubuntu'"] {
    font-family: 'Inter', sans-serif !important;
    color: #6c757d !important;
    font-size: 0.8em !important;
}



/* ========================================
   IRSTATS2 - Ultra Compact Modern
   ======================================== */

.main-content:has(.irstats2_view) { background: linear-gradient(135deg, #e3edfc, #d9e6fa) !important; padding: 16px !important; }
h2.report_title { display: none !important; }
.irstats2_view, .irstats2_view > div { text-align: left !important; }

/* Header */
.irstats2_view_ReportHeader { margin-bottom: 12px !important; }
.irstats2_view_ReportHeader .irstats2_view_content { background: white !important; border-radius: 8px !important; padding: 12px 16px !important; box-shadow: 0 1px 4px rgba(0,82,204,0.08) !important; }
.irstats2_reportheader_breadcrumbs { font-size: 1em !important; font-weight: 700 !important; color: #002b80 !important; }
.irstats2_reportheader_timeline { display: none !important; }
.irstats2_reportheader_options { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid #e5e7eb !important; }
.irstats2_form_action_button { background: #f0f6ff !important; color: #0052cc !important; border: 1px solid #c5d9f7 !important; padding: 5px 12px !important; border-radius: 5px !important; font-weight: 600 !important; font-size: 0.75em !important; cursor: pointer !important; }
.irstats2_form_action_button:hover, .irstats2_form_action_button_selected { background: #0052cc !important; color: white !important; }

/* Panels */
.irstats2_options_filters, .irstats2_options_dates, .irstats2_options_reports { background: #f8faff !important; border: 1px solid #d4e3f7 !important; border-radius: 6px !important; padding: 10px !important; margin-top: 8px !important; font-size: 0.85em !important; }
.irstats2_options_filters select, .irstats2_options_filters input, .irstats2_options_dates select, .irstats2_options_dates input { padding: 5px 8px !important; border: 1px solid #d4e3f7 !important; border-radius: 4px !important; font-size: 0.85em !important; }
.irstats2_datepicker_inner td { padding: 6px !important; border: none !important; background: transparent !important; font-size: 0.85em !important; }
.irstats2_reports { width: 100% !important; font-size: 0.85em !important; }
.irstats2_reports_heading { background: #0052cc !important; color: white !important; padding: 5px 10px !important; font-size: 0.8em !important; }
.irstats2_reports_content { padding: 5px 10px !important; }
.irstats2_reportheader_link { padding: 3px 8px !important; margin: 2px !important; background: #f0f6ff !important; color: #0052cc !important; border-radius: 4px !important; font-size: 0.75em !important; text-decoration: none !important; display: inline-block !important; }

/* Cards */
.irstats2_view { margin-bottom: 12px !important; }
.irstats2_view_title { background: #f0f6ff !important; color: #002b80 !important; padding: 10px 14px !important; border-radius: 8px 8px 0 0 !important; font-weight: 600 !important; font-size: 0.85em !important; border: 1px solid #c5d9f7 !important; border-bottom: none !important; }
.irstats2_view_content { background: white !important; border-radius: 0 0 8px 8px !important; padding: 12px !important; border: 1px solid #c5d9f7 !important; border-top: none !important; }

/* ===== KEY FIGURES - Compact Grid ===== */
.irstats2_keyfigures { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 10px !important; }
.irstats2_keyfigures_section { background: #f8faff !important; border: 1px solid #d4e3f7 !important; border-radius: 6px !important; padding: 12px 8px !important; text-align: center !important; }
.irstats2_keyfigures_section:hover { border-color: #0052cc !important; }
.irstats2_googlespark { display: none !important; }
.irstats2_keyfigures_metric { display: block !important; }
.irstats2_keyfigures_metric_figure { font-size: 1.3em !important; font-weight: 800 !important; color: #0052cc !important; display: block !important; }
.irstats2_keyfigures_metric_text { font-size: 0.65em !important; color: #64748b !important; font-weight: 600 !important; text-transform: uppercase !important; display: block !important; margin-top: 2px !important; }
.irstats2_ruler { display: none !important; }
.irstats2_keyfigures_progress { width: 100% !important; }
.irstats2_keyfigures_progress td { padding: 2px 4px !important; vertical-align: middle !important; }
.irstats2_progress_wrapper { background: #e2e8f0 !important; border-radius: 3px !important; height: 6px !important; max-width: 60px !important; overflow: hidden !important; display: inline-block !important; vertical-align: middle !important; }
.irstats2_progress { background: linear-gradient(90deg, #10b981, #059669) !important; height: 100% !important; }
.irstats2_keyfigures_section .irstats2_progress span { display: none !important; }

/* Charts */
.irstats2_googlegraph { min-height: 180px !important; background: #fafbff !important; border-radius: 4px !important; }

/* ===== TABLES - Compact ===== */
.irstats2_table { width: 100% !important; }
.irstats2_table table { width: 100% !important; border-collapse: collapse !important; font-size: 0.8em !important; }
.irstats2_table tr { border-bottom: 1px solid #f1f5f9 !important; }
.irstats2_table td { padding: 8px 6px !important; vertical-align: middle !important; }
.irstats2_table tr:hover td { background: #f8faff !important; }
.irstats2_table a { color: #0052cc !important; text-decoration: none !important; font-weight: 500 !important; }
.irstats2_table_cell_order { width: 24px !important; color: #94a3b8 !important; font-weight: 600 !important; }
.irstats2_table_cell_count { width: 100px !important; }
.irstats2_table_cell_count .irstats2_progress_wrapper { max-width: 70px !important; height: 16px !important; border-radius: 3px !important; }
.irstats2_table_cell_count .irstats2_progress { border-radius: 3px !important; }
.irstats2_table_cell_count .irstats2_progress span { display: inline !important; font-size: 0.7em !important; color: white !important; font-weight: 600 !important; padding: 0 4px !important; line-height: 16px !important; }
.irstats2_table_options { margin-top: 8px !important; font-size: 0.75em !important; }
.irstats2_table_options a { padding: 2px 6px !important; margin: 1px !important; background: #f0f6ff !important; color: #0052cc !important; border-radius: 3px !important; text-decoration: none !important; }

/* Grid */
.irstats2_view_Grid { border-collapse: separate !important; border-spacing: 12px !important; width: 100% !important; }
.irstats2_view_Grid > tbody > tr > td { vertical-align: top !important; padding: 0 !important; }

/* Export */
.irstats2_export_bar_toggle img { width: 12px !important; filter: brightness(0) saturate(100%) invert(24%) sepia(89%) saturate(1234%) hue-rotate(206deg) !important; }
.irstats2_export_content { background: #f8faff !important; padding: 8px !important; border-radius: 4px !important; margin-top: 6px !important; font-size: 0.8em !important; }

/* Responsive */
@media (max-width: 992px) {
    .irstats2_keyfigures { grid-template-columns: repeat(2, 1fr) !important; }
    .irstats2_view_Grid > tbody > tr { display: flex !important; flex-direction: column !important; gap: 12px !important; }
    .irstats2_view_Grid > tbody > tr > td { width: 100% !important; }
}
@media (max-width: 576px) {
    .main-content:has(.irstats2_view) { padding: 10px !important; }
    .irstats2_keyfigures { gap: 6px !important; }
    .irstats2_keyfigures_section { padding: 8px 6px !important; }
    .irstats2_keyfigures_metric_figure { font-size: 1.1em !important; }
    .irstats2_view_title { padding: 8px 10px !important; font-size: 0.8em !important; }
    .irstats2_view_content { padding: 10px !important; }
}

/* Keep user navbar visible while scrolling without changing its colors */
.user-navbar {
    position: sticky;
    top: 0;
    z-index: 900;
}