/* ==========================================
        SEARCH RESULTS
========================================== */

.search-item{

    display:flex;

    align-items:center;

    gap:16px;

    padding:16px 18px;

    text-decoration:none;

    transition:.25s;

    cursor:pointer;

    border-bottom:1px solid #f1f5f9;

}

.search-item:hover{

    background:#f8fbff;

    transform:translateX(4px);

}

.search-item img {

    width: 80px;

    height: 60px;

    border-radius: 10px;

    object-fit: cover;

    flex-shrink: 0;

}

.search-info {

    flex: 1;

}

.search-info h4{

    font-size:17px;

    font-weight:700;

    color:#111827;

    margin-bottom:6px;

    line-height:1.4;

}

.search-info p {

    color: #6b7280;

    font-size: 13px;

}

.search-empty {

    padding: 18px;

    text-align: center;

    color: #64748b;

}



/* ==========================================
        SEARCH DROPDOWN
========================================== */

.nav-right {

    position: relative;

}

.search-dropdown {

    position: absolute;

    top: 115%;

    right: 0;

    left: auto;

    width: 500px;

    background: #fff;

    border: 1px solid #e5e7eb;

    border-radius: 18px;

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

    overflow: hidden;

    display: none;

    z-index: 9999;

}

.search-dropdown.active {

    display: block;

}



/* ==========================================
        SEARCH META
========================================== */

.search-meta{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:8px;

}

.search-category{

    display:inline-flex;

    align-items:center;

    padding:6px 12px;

    border-radius:999px;

    background:#eff6ff;

    color:#2563eb;

    font-size:12px;

    font-weight:600;

}

.search-time{

    display:flex;

    align-items:center;

    gap:6px;

    color:#6b7280;

    font-size:13px;

}



.search-thumb{

    width:80px;

    height:60px;

    border-radius:10px;

    overflow:hidden;

    flex-shrink:0;

}

.search-thumb img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.3s;

}

.search-item:hover .search-thumb img{

    transform:scale(1.08);

}

.search-arrow{

    margin-left:auto;

    color:#94a3b8;

    opacity:0;

    transform:translateX(-8px);

    transition:.3s;

}

.search-item:hover .search-arrow{

    opacity:1;

    transform:translateX(0);

}


.search-item:last-child{

    border-bottom:none;

}