/* css/style-search.css */

/* Styles originally from search.html's inline <style> block */
.search-results-title-section {
    padding: var(--espacamento-l) 0 var(--espacamento-m); /* */
    text-align: left; /* */
}
.search-results-title-section h1 {
    font-size: 2.2rem; /* */
    color: var(--cor-primaria-hover-platinum); /* */
    margin: 0 0 var(--espacamento-s) 0; /* */
    font-weight: 700; /* */
}
.search-results-title-section h1 #search-query-display {
    color: var(--cor-secundaria-platinum); /* */
}

.search-layout-grid {
    display: grid; /* */
    grid-template-columns: 1fr; /* */
    gap: var(--espacamento-xl); /* */
}
@media (min-width: 992px) {
    .search-layout-grid {
        grid-template-columns: minmax(0, 2.5fr) minmax(0, 1fr); /* Proporção sidebar */ /* */
    }
}
.main-search-content {
    min-width: 0; /* */
}
.sidebar-search {
    min-width: 0; /* Permitir que encolha */ /* */
}

.main-search-content .content-header {
    display: flex; /* */
    flex-wrap: wrap; /* */
    justify-content: space-between; /* */
    align-items: center; /* */
    margin-bottom: var(--espacamento-l); /* */
    padding-bottom: var(--espacamento-m); /* */
    border-bottom: 1px solid var(--cor-borda-suave-platinum); /* */
}
.main-search-content .content-header h3 {
    margin: 0 0 var(--espacamento-s) 0; /* */
    font-size: 1.6rem; /* */
    font-weight: 600; /* */
    color: var(--cor-primaria-platinum); /* */
}
@media (min-width: 768px) {
    .main-search-content .content-header h3 {
        margin-bottom: 0; /* */
    }
}
.main-search-content .search-controls {
    display: flex; /* */
    align-items: center; /* */
    gap: var(--espacamento-s); /* */
}
.main-search-content .search-controls label {
    font-size: 0.95rem; /* */
    color: var(--cor-texto-medio-platinum); /* */
    margin-bottom: 0; /* */
    white-space: nowrap; /* */
    font-weight: 500; /* */
}

/* Styles for the <select> elements used for sorting and filtering */
.styled-select {
    padding: var(--espacamento-s) var(--espacamento-m); /* */
    border-radius: var(--border-radius-small); /* */
    border: 1px solid var(--cor-borda-input-platinum); /* */
    background-color: var(--cor-fundo-elementos-platinum); /* */
    font-size: 0.95rem; /* */
    min-width: 200px; /* */
    line-height: 1.5; /* */
    height: auto; /* */
    box-shadow: var(--sombra-leve-platinum); /* */
}
.styled-select:focus {
    border-color: var(--cor-borda-input-focus-platinum); /* */
    outline: 0; /* */
    box-shadow: var(--sombra-focus-platinum); /* */
}

/* Styles for the sidebar widgets on the search page */
.sidebar-search .sidebar-widget {
    background-color: var(--cor-fundo-elementos-platinum); /* */
    padding: var(--espacamento-l); /* */
    border-radius: var(--border-radius-large); /* */
    box-shadow: var(--sombra-card-elegante-platinum); /* */
    margin-bottom: var(--espacamento-xl); /* */
    border: 1px solid var(--cor-borda-suave-platinum); /* */
}
.sidebar-search .sidebar-widget h4 {
    margin-top: 0; /* */
    margin-bottom: var(--espacamento-m); /* */
    font-size: 1.3rem; /* */
    font-weight: 600; /* */
    color: var(--cor-primaria-platinum); /* */
    padding-bottom: var(--espacamento-s); /* */
    border-bottom: 2px solid var(--cor-secundaria-platinum); /* */
    display: flex; /* */
    align-items: center; /* */
    gap: var(--espacamento-xs); /* */
}
.sidebar-search .sidebar-widget h4 i.fas { /* Icon within the H4 title of search sidebar widgets */
    font-size: 0.9em; /* */
    /* Consider adding explicit color if needed, e.g.: color: var(--cor-secundaria-platinum); */
}
.sidebar-search .filter-options .form-group {
    margin-bottom: var(--espacamento-l); /* */
}
.sidebar-search .filter-options .form-group label {
    display: block; /* */
    margin-bottom: var(--espacamento-xs); /* */
    font-size: 0.9rem; /* */
    font-weight: 600; /* */
    color: var(--cor-texto-escuro-platinum); /* */
}

/* Styles for placeholder messages (initial, loading, no results) in the main content area */
.initial-message-placeholder, .loading-message, .no-results-message {
    padding: var(--espacamento-xxl) var(--espacamento-l); /* */
    text-align: center; /* */
    color: var(--cor-texto-medio-platinum); /* */
    background-color: var(--cor-fundo-pagina-platinum); /* */
    border-radius: var(--border-radius-base); /* */
    margin: var(--espacamento-l) 0; /* */
    font-size: 1.1rem; /* */
    border: 2px dashed var(--cor-borda-suave-platinum); /* */
    display: flex; /* */
    flex-direction: column; /* */
    align-items: center; /* */
    justify-content: center; /* */
    min-height: 200px; /* */
}
.initial-message-placeholder i, .loading-message i, .no-results-message i {
    font-size: 2.5rem; /* */
    margin-bottom: var(--espacamento-m); /* */
    color: var(--cor-borda-input-platinum); /* */
}

/* Style for error messages */
.error-message {
    color: var(--cor-perigo-platinum); /* */
    border-color: var(--cor-perigo-platinum); /* */
    background-color: var(--cor-perigo-translucida-platinum); /* */
}

/* Styles for placeholder messages within the sidebar's company list */
.sidebar #search-companies-list .loading-message-sidebar,
.sidebar #search-companies-list .no-results-message-sidebar,
.sidebar #search-companies-list .initial-sidebar-message {
    padding: var(--espacamento-l); /* */
    font-style: italic; /* */
    color: var(--cor-texto-medio-platinum);
    text-align: center;
}

/* Added style for company logo in the search results ranking list (sidebar) */
.company-logo-ranking {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border-radius: var(--border-radius-base); /* Consistent with .company-logo-list */
    border: 1px solid var(--cor-borda-suave-platinum);
    background-color: var(--cor-fundo-elementos-platinum);
    padding: var(--espacamento-xxs);
    flex-shrink: 0;
    margin-right: var(--espacamento-s); /* Adds some space between logo and company info */
}

/*
   The .ranking-item class (for each company in the sidebar)
   and its inner elements (.ranking-info, .ranking-name, .ranking-stats, .stars, .btn-icon-link)
   are primarily styled by your global style.css.
*/

#search-companies-list .ranking-item {
    /* Global .ranking-item provides: display:flex, align-items:flex-start, padding: var(--espacamento-s) 0, border-bottom */
    /* The `align-items: flex-start;` from search.html inline style is likely already in global .ranking-item */

    /* Optional Enhancement: If you want each company item in the sidebar to look more like a distinct card: */
    /*
    background-color: var(--cor-fundo-elementos-platinum);  // Or var(--cor-fundo-pagina-platinum) if widget bg is white
    padding: var(--espacamento-m); // Adjust padding for a card feel
    border-radius: var(--border-radius-base);
    box-shadow: var(--sombra-leve-platinum);
    margin-bottom: var(--espacamento-m); // Creates space between cards
    border-bottom: none; // Remove the line if using shadow/margin for separation
    */
}
/* If using the optional enhancement above, you might also want this: */
/*
#search-companies-list .ranking-item:last-child {
    margin-bottom: 0;
    border-bottom: none; // If you removed it above
}
*/

#search-companies-list .ranking-name {
    /* Global .ranking-name provides: font-weight, color, margin-bottom, font-size */
    white-space: normal; /* Allows company name to wrap if too long */ /* */
}

/* Responsive adjustments from search.html's inline style block */
@media (max-width: 768px) {
    .main-search-content .content-header {
        gap: var(--espacamento-m); /* */
    }
    .search-results-title-section h1 {
        font-size: 1.8rem; /* */
    }
    .main-search-content .content-header h3 {
        font-size: 1.3rem; /* */
    }
    .main-search-content .search-controls label,
    .main-search-content .styled-select {
        font-size: 0.9rem; /* */
    }
}