/* NAVBAR */

.navbar-custom{

background:
linear-gradient(
135deg,
rgba(15,23,42,.97),
rgba(30,41,59,.94)
);

padding:14px 24px;

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

flex-wrap:wrap;

position:sticky;

top:0;

z-index:9999;

width:100%;
}

.nav-left{

display:flex;

align-items:center;

gap:10px;

flex-wrap:wrap;
}

.menu-navbar{

color:white;

text-decoration:none;

font-size:16px;

font-weight:700;

display:flex;

align-items:center;

gap:10px;

padding:10px 14px;

border-radius:12px;

transition:.3s;
}

.menu-navbar:hover{

background:rgba(255,255,255,.08);

color:#60a5fa;
}

.dropdown-navbar{
position:relative;

position:relative;
}

.dropdown-button{

border:none;

background:none;
}

.dropdown-content{

display:none;

position:absolute;

top:100%;

left:0;

min-width:260px;

background:white;

border-radius:18px;

padding:14px 0;

box-shadow:
0 20px 50px rgba(0,0,0,.15);

z-index:99999;
}

.dropdown-content a{

display:block;

padding:12px 20px;

text-decoration:none;

color:#0f172a;

font-weight:600;
}

.dropdown-content a:hover{

background:#eff6ff;
}

/* ===== FIX DROPDOWN PROFIL ONLY ===== */

.dropdown-navbar{
overflow:visible !important;
}

.navbar-custom{
overflow:visible !important;
}

#profilDropdown{
position:relative !important;
padding-bottom:12px !important;
z-index:999999 !important;
}

#profilDropdown .dropdown-content{
margin-top:0 !important;
pointer-events:auto !important;
z-index:999999 !important;
}

#profilDropdown .dropdown-content li,
#profilDropdown .dropdown-content a{
pointer-events:auto !important;
position:relative !important;
z-index:999999 !important;
}

/* ===== END FIX ===== */

#produkDropdown:hover .dropdown-content{
display:block;
}

/* PROFIL dropdown pakai JS click */

#profilDropdown:hover .dropdown-content{
display:block !important;
}


.search-form{

display:flex;

align-items:center;

overflow:hidden;

border-radius:50px;

background:white;
}

.search-box{

width:320px;

height:54px;

border:none;

outline:none;

padding:0 20px;

font-size:16px;

font-weight:600;
}

.search-button{

width:60px;

height:54px;

border:none;

background:#2563eb;

color:white;

font-size:18px;
}

.admin-navbar-btn{

background:#2563eb;
}

.language-dropdown{

right:0;

left:auto;
}

@media(max-width:992px){

.navbar-custom{

justify-content:center;
}

.search-form{

width:100%;
}

.search-box{

width:100%;
}

.nav-left{

justify-content:center;
}

.dropdown-content{

position:absolute !important;

width:auto !important;
}

}

/* LIVE SEARCH */

.search-form{
position:relative;
}

.live-search-results{
position:absolute;
top:110%;
left:0;
width:100%;
background:#fff;
border-radius:24px;
overflow:hidden;
box-shadow:0 25px 60px rgba(15,23,42,.18);
z-index:999999;
max-height:500px;
overflow-y:auto;
}

.live-search-item{
display:block;
padding:18px 22px;
border-bottom:1px solid #e2e8f0;
text-decoration:none;
transition:.25s;
}

.live-search-item:hover{
background:#eff6ff;
}

.live-search-title{
font-size:18px;
font-weight:800;
color:#0f172a;
margin-bottom:6px;
line-height:1.5;
}

.live-search-meta{
font-size:14px;
font-weight:600;
color:#64748b;
}

.live-search-empty{
padding:24px;
font-weight:700;
text-align:center;
color:#dc2626;
}



/* MOBILE RESPONSIVE FIX */
@media(max-width:768px){
    .menu-navbar {
        font-size: 14px !important;
        padding: 8px 10px !important;
    }
    .navbar-custom {
        padding: 8px 12px !important;
        gap: 6px !important;
    }
    .logo-text {
        font-size: 12px !important;
    }
    .nav-left {
        gap: 4px !important;
    }
    .dropdown-content {
        font-size: 13px !important;
    }
    .search-modern-input {
        font-size: 13px !important;
    }
    .live-search-title {
        font-size: 14px !important;
    }
    .live-search-meta {
        font-size: 12px !important;
    }
}

@media(max-width:480px){
    .menu-navbar {
        font-size: 12px !important;
        padding: 6px 8px !important;
    }
    .menu-navbar span {
        display: none;
    }
}

/* Fix menu text mobile */
@media(max-width:768px){
    .menu-navbar span {
        display: inline !important;
        font-size: 13px !important;
    }
    .menu-navbar {
        font-size: 13px !important;
        padding: 8px 6px !important;
    }
}

/* FIX NAVBAR MOBILE */
@media(max-width:768px){
    .navbar-custom {
        position: sticky !important;
        top: 0 !important;
        z-index: 9999 !important;
        width: 100% !important;
    }
    .dropdown-content {
        position: fixed !important;
        top: auto !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 99999 !important;
        max-height: 60vh !important;
        overflow-y: auto !important;
    }
}

/* HAMBURGER MENU MOBILE */
.hamburger-btn {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    color: white;
    font-size: 28px;
}

@media(max-width:992px){
    .hamburger-btn {
        display: block !important;
    }
    .nav-left {
        display: none !important;
        flex-direction: column !important;
        width: 100% !important;
        background: #0f172a !important;
        padding: 10px 0 !important;
        gap: 0 !important;
    }
    .nav-left.mobile-open {
        display: flex !important;
    }
    .navbar-custom {
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 10px 16px !important;
    }
    .menu-navbar {
        width: 100% !important;
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important;
        font-size: 15px !important;
    }
    .dropdown-content {
        position: static !important;
        width: 100% !important;
        box-shadow: none !important;
        background: rgba(255,255,255,0.05) !important;
        border-radius: 0 !important;
        padding-left: 20px !important;
    }
    .search-form {
        width: 100% !important;
        order: 3 !important;
    }
    .admin-navbar-btn {
        display: none !important;
    }
}

/* DESKTOP SHRINK - fit extra menu items (Monografi, dll) on laptop widths */
@media(min-width:993px) and (max-width:1600px){
    .navbar-custom{
        padding:12px 18px !important;
        gap:8px !important;
    }
    .nav-left{
        gap:4px !important;
    }
    .menu-navbar{
        font-size:14px !important;
        padding:9px 11px !important;
        gap:7px !important;
    }
    .dropdown-content{
        min-width:220px !important;
    }
}

@media(min-width:993px) and (max-width:1300px){
    .menu-navbar{
        font-size:12.5px !important;
        padding:8px 9px !important;
        gap:5px !important;
    }
    .nav-left{
        gap:2px !important;
    }
}

/* FIX STICKY NAVBAR OVERLAP */
@media(max-width:992px){
    .search-form {
        position: sticky !important;
        top: 0 !important;
        z-index: 8888 !important;
        background: #0f172a !important;
        padding: 8px 12px !important;
        width: 100% !important;
    }
    .navbar-custom {
        position: relative !important;
        top: auto !important;
    }
}