﻿.ui-autocomplete {
    /*max-width: 600px;*/
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    padding: 8px 0;
    margin-top: 4px;
    border: none;
}
.ui-menu-item {
    width: 100% !important;
    box-sizing: border-box;
    padding: 0; /* Remove default padding if any */
    margin: 0; /* Remove default margin if any */
}
    .ui-autocomplete .ui-menu-item {
        padding: 0px 15px;
        cursor: pointer;
        display: flex;
        align-items: center;
        transition: background-color 0.2s;
    }

        .ui-autocomplete .ui-menu-item:hover {
            background-color: #f5f5f5;
        }

        .ui-autocomplete .ui-menu-item div {
            display: flex;
            flex-direction: column;
        }

        .ui-autocomplete .ui-menu-item .title {
            font-weight: 500;
            color: #333;
            margin-bottom: 4px;
        }

        .ui-autocomplete .ui-menu-item .description {
            font-size: 0.9em;
            color: #666;
        }

        .ui-autocomplete .ui-menu-item .highlight {
            background-color: #fff3cd;
            padding: 0 2px;
            border-radius: 2px;
        }

        .autocomplete-highlight {
            font-weight: bold;
            /* Add any other necessary styles here to control spacing */
        }

        .ui-autocomplete .ui-menu-item .result-count {
            margin-left: auto;
            color: #666;
            font-size: 0.9em;
        }

        .ui-autocomplete .ui-menu-item .program-image {
            width: 40px;
            height: 40px;
            border-radius: 4px;
            margin-right: 12px;
            object-fit: cover;
        }
.ts-autocomplete-menu {
    background: #fff !important;
    border: none;
    box-shadow: 0 4px 24px rgba(0,0,0,0.08);
    padding: 0;
    border-radius: 16px;
    max-width: 960px;
    z-index: 9999;
    /*direction: rtl;*/
    overflow-x: auto;
    white-space: nowrap;
}

.ui-autocomplete.autocomplete-wide {
    /*width: 2352.03px !important;*/
    max-width: 1760px !important;
}
    .ts-autocomplete-menu li {
        background: rgb(245 245 248); /* Slightly darker gray for better contrast */
        margin: 5px 0;
        border-radius: 12px;
        border: none;
        position: relative;
        box-shadow: 0 2px 0 0 #fff;
        transition: background 0.2s, box-shadow 0.2s;
        padding: 0;
    }

        .ts-autocomplete-menu li:last-child {
            box-shadow: none;
        }

.ts-row {
    width: 100%;
    box-sizing: border-box;
    /* Keep your existing padding for spacing inside the row */
}

.ts-autocomplete-menu,
.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front.ts-autocomplete-menu {
    min-width: 0 !important;
    box-sizing: border-box;

}
/*header .search_menu .ts-autocomplete-menu,
header .search_menu .ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front.ts-autocomplete-menu {
    width: 100% !important;
    width: calc(100% - 68px - 75px ) !important;
    left: calc(68px) !important
}*/

.ts-autocomplete-menu {
    }.ts-row:hover {
    background: #e2e6ea;
    box-shadow: 0 4px 12px rgba(0,0,0,0.10);
}

.ts-title-row {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* For RTL: aligns both title and type to the right */
    width: 100%;
    white-space: normal;
    gap: 0;
    padding: 0;
}
.ts-title {
    font-weight: 700;
    font-size: 15px;
    color: #8d8d9a;
    /*display: flex;*/
    gap: 6px;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    direction: rtl;
    line-height: 1.4;
    word-break: break-word;
    padding-top: 10px;
    width: 100%;
    flex-direction: row;
    align-content: center;
    justify-content: space-between;
    align-items: stretch; /* For RTL: right-aligns the text and icon */
}
.ts-title-text {
    flex: 1;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ts-type {
    font-size: 15px;
    color: #0956fc;
    margin-top: 2px;
    margin-bottom: 2px;
    text-align: justify;
    width: 100%;
    font-weight: 500;
    letter-spacing: 0.2px;
    padding-right: 7px; /* Remove any left/right padding */
}
[dir=ltr] .ts-type{
text-align:left
}

.ts-link-icon {
    display: flex;
    align-items: flex-end;
    color: #0073e6;
    opacity: 0.8;
    transition: opacity 0.2s;
    text-decoration: none;
    margin-right: 4px;
    min-width: 16px;
}

.ts-title:hover .ts-link-icon {
    opacity: 1;
}

.mark {
    background-color: yellow;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: bold;
}
.filter_select_list .input input {
    width: 100%;
    padding: 9.5px 16px;
    border: 1px solid rgba(207, 203, 233, 0.8);
    border-radius: 20px;
    background-color: #F9FAFB !important;
}
.filter_select_list .input{padding:0 !important;border-radius:0 !important;border:none !important;background:none !important}
.search_menu .content .search-header .input{padding-right:0 !important;padding-left:0 !important}
.search-header .container.t-all{padding:0 !important}
.search_menu .content .search-header .input input{padding-right:30px !important}

/* Ensure browser autocomplete works with jQuery UI autocomplete */
.ui-autocomplete-input {
    /* Allow browser autocomplete to work */
    -webkit-autocomplete: auto !important;
    -moz-autocomplete: auto !important;
    autocomplete: auto !important;
}

/* Hide browser autocomplete when jQuery UI autocomplete is open */
.ui-autocomplete:not(:empty) ~ .ui-autocomplete-input::-webkit-autofill,
.ui-autocomplete:not(:empty) ~ .ui-autocomplete-input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

/* Ensure proper layering */
.ui-autocomplete {
    position: absolute !important;
    z-index: 9999 !important;
}

/* Prevent browser autocomplete from interfering with jQuery UI autocomplete */
.ui-autocomplete-input:focus + .ui-autocomplete {
    z-index: 10000 !important;
}