/* ==========================================================================
   1. СТРУКТУРА И ПОДРАВНЯВАНЕ НА РЕДА В ТРОХИЧКИТЕ (ОТ ХЕДЪРА)
   ========================================================================== */
.custom-breadcrumb-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important; /* Вертикално центриране */
    width: 100% !important;
    max-width: 100% !important; 
    padding: 0 3% !important; /* Изтласкваме елементите точно с 3% от двата края */
    margin: 15px 0 !important; 
    clear: both !important;
    float: none !important;
    box-sizing: border-box !important;
}

.custom-breadcrumb-links, 
.custom-breadcrumb-links #crumbs {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    width: auto !important;
}

.custom-breadcrumb-search {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

/* Формата в хедъра (малката търсачка в трохичките) */
.custom-breadcrumb-search .search_bar form.asearch {
    display: flex !important;
    align-items: center !important; 
    justify-content: center !important;
    width: 100% !important;
    border: none !important; 
    border-radius: 4px !important;
    overflow: hidden !important;
    background: #ffffff !important; 
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important; 
    margin: 0 !important;
    padding: 0 !important;
    height: 38px !important; 
    box-sizing: border-box !important;
}

/* Полето за писане в хедъра */
.custom-breadcrumb-search .search_bar input.input_search {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 12px !important; 
    margin: 0 !important;
    height: 100% !important; 
    line-height: 38px !important; 
    outline: none !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
}

/* Лилавият бутон с лупата в хедъра */
.custom-breadcrumb-search .search_bar button.mybtn {
    background-color: #b500b5 !important; 
    color: white !important;
    border: none !important;
    width: 42px !important;
    height: 100% !important; 
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    transition: background-color 0.2s ease !important;
}

.custom-breadcrumb-search .search_bar button.mybtn:hover {
    background-color: #940094 !important; 
}

/* ==========================================================================
   2. ГЛОБАЛНА СТРУКТУРА НА ПАДАЩИЯ ПРОЗОРЕЦ (БЕЗ ИЗБЛЪСКВАНЕ)
   ========================================================================== */
.search_bar {
    position: relative !important;
    width: 100% !important;
    display: block !important;
}

/* Настройки за затваряне и центриране на резултатите под голямата търсачка */
.search_bar .search_result {
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important; /* Центрира прозореца под централната търсачка */
    width: 100% !important; 
    max-width: 500px !important; /* Ограничава ширината до формата ви */
    background: #ffffff !important;
    border-radius: 0 0 4px 4px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
    z-index: 99999 !important;
    margin-top: 2px !important;
    max-height: 380px !important;
    overflow-y: auto !important;
}

/* Изключения за малката търсачка в хедъра (за да не се центрира насила там) */
.custom-breadcrumb-search .search_result {
    left: 0 !important;
    transform: none !important;
    max-width: 100% !important;
}

.search_result ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* ==========================================================================
   3. ГЛОБАЛНА ВИЗИЯ ЗА ГОЛЯМАТА ЦЕНТРАЛНА ТЪРСАЧКА
   ========================================================================== */
form.asearch {
    display: flex !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 500px;
    margin: 20px auto !important;
}

form.asearch input.input_search {
    flex: 1 !important;
    border: 1px solid #ccc !important;
    background: #ffffff !important;
    padding: 0 12px !important; 
    margin: 0 !important;
    height: 44px !important; 
    line-height: 44px !important; 
    outline: none !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
    border-radius: 4px 0 0 4px !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05) !important;
}

/* Корекция за бутона на голямата централна търсачка */
button.mybtn, 
form.asearch button.mybtn {
    width: 50px !important;
    height: 44px !important;
    background-color: #b500b5 !important; 
    color: #ffffff !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    border-radius: 0 4px 4px 0 !important; 
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    flex-shrink: 0 !important; 
}

button.mybtn:hover,
form.asearch button.mybtn:hover {
    background-color: #940094 !important; 
}

/* ==========================================================================
   4. АДАПТИВНОСТ ЗА МОБИЛНИ ТЕЛЕФОНИ
   ========================================================================== */
@media (max-width: 768px) {
    .custom-breadcrumb-container {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        padding: 0 3% !important; 
    }
    .custom-breadcrumb-search {
        max-width: 100% !important;
    }
}
