/* ------------------------------------------------------------------
   Oportunidades: projetos, editais, empresas, candidaturas e matching.
   Usa apenas variaveis ja definidas em main.css (com fallback seguro).
------------------------------------------------------------------ */

.opp-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

.opp-card {
    display: flex;
    flex-direction: column;
    background: var(--slz7-card-bg, #fff);
    border: 1px solid var(--slz7-border, #e6e6e6);
    border-radius: 14px;
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease;
}
.opp-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.09); }

.opp-thumb { position: relative; display: block; aspect-ratio: 16/9; background: #f2f3f5; }
.opp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.opp-thumb-fallback {
    display: flex; align-items: center; justify-content: center;
    width: 100%; height: 100%; font-size: 34px; color: #b9bec7;
}

.opp-kind {
    position: absolute; top: 10px; left: 10px;
    background: var(--slz7-primary, #111);
    color: #fff; font-size: 12px; font-weight: 700;
    padding: 4px 10px; border-radius: 999px;
}
.opp-kind.is-inline { position: static; display: inline-block; margin-bottom: 10px; }

.opp-body { display: flex; flex-direction: column; gap: 8px; padding: 16px; }
.opp-body h3 { margin: 0; font-size: 18px; line-height: 1.3; }
.opp-body h3 a { color: inherit; text-decoration: none; }
.opp-cat { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--slz7-primary, #666); }
.opp-company { font-size: 13px; color: #666; text-decoration: none; }
.opp-excerpt { margin: 0; font-size: 14px; color: #666; }

.opp-meta { display: flex; flex-wrap: wrap; gap: 10px 16px; font-size: 13px; color: #555; align-items: center; }
.opp-status {
    background: #eef4ff; color: #1e57c6;
    padding: 3px 10px; border-radius: 999px; font-weight: 700; font-size: 12px;
}

.slz7-match {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: 700; padding: 4px 10px;
    border-radius: 999px; width: fit-content;
}
.slz7-match.is-high { background: #e8f7ee; color: #17794a; }
.slz7-match.is-mid  { background: #fff5e0; color: #a26a00; }
.slz7-match.is-low  { background: #f1f2f4; color: #5b6270; }

/* -------- pagina interna -------- */
.opp-single-grid { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 32px; align-items: start; }
.opp-main h1 { margin: 0 0 12px; }
.opp-cover { margin: 20px 0; border-radius: 14px; overflow: hidden; }
.opp-cover img { width: 100%; height: auto; display: block; }
.opp-content { line-height: 1.7; }
.opp-list { padding-left: 20px; line-height: 1.8; }
.opp-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.opp-tags a {
    background: #f2f3f5; color: #333; text-decoration: none;
    padding: 6px 12px; border-radius: 999px; font-size: 13px;
}
.opp-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }

.opp-box {
    background: var(--slz7-card-bg, #fff);
    border: 1px solid var(--slz7-border, #e6e6e6);
    border-radius: 14px; padding: 18px;
    position: sticky; top: 90px;
}
.opp-box h3 { margin: 0 0 12px; font-size: 16px; }
.opp-facts { list-style: none; margin: 0 0 12px; padding: 0; }
.opp-facts li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dashed #e8e8e8; font-size: 14px; }
.opp-facts li:last-child { border-bottom: 0; }
.opp-facts span { color: #777; }

.emp-logo img { max-width: 160px; height: auto; border-radius: 12px; }

/* -------- candidatura -------- */
.opp-apply { margin-top: 28px; }
.slz7-apply-form {
    display: flex; flex-direction: column; gap: 14px;
    background: #fafbfc; border: 1px solid var(--slz7-border, #e6e6e6);
    border-radius: 14px; padding: 20px;
}
.slz7-apply-form h3 { margin: 0; }
.slz7-apply-form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; }
.slz7-apply-form input, .slz7-apply-form textarea, .slz7-app-status select {
    width: 100%; padding: 10px 12px; border: 1px solid #d9dce1;
    border-radius: 10px; font: inherit; font-weight: 400;
}
.slz7-apply-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }

.slz7-notice {
    padding: 12px 16px; border-radius: 10px; margin-bottom: 16px;
    background: #f1f2f4; font-size: 14px;
}
.slz7-notice.is-ok { background: #e8f7ee; color: #17794a; }
.slz7-notice.is-error { background: #fdeaea; color: #a32020; }

.slz7-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.slz7-table th, .slz7-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #ececec; vertical-align: middle; }
.slz7-table th { font-size: 12px; text-transform: uppercase; color: #777; }
.slz7-badge { background: #f1f2f4; border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 700; }

@media (max-width: 900px) {
    .opp-single-grid { grid-template-columns: 1fr; }
    .opp-box { position: static; }
    .slz7-apply-grid { grid-template-columns: 1fr; }
    .slz7-table { display: block; overflow-x: auto; }
}

/* ------------------------------------------------------------------
   Exibicao em lista (vertical) — usada nas listagens de empresas,
   editais e projetos, no painel do criador e nas sessoes das paginas
   individuais. Mesmo visual no desktop e no mobile.
------------------------------------------------------------------ */
.opp-grid.is-list { display: flex; flex-direction: column; gap: 14px; }

.opp-grid.is-list .opp-card {
    flex-direction: row;
    align-items: stretch;
    border-radius: 12px;
}
.opp-grid.is-list .opp-card:hover { transform: none; box-shadow: 0 8px 20px rgba(0,0,0,.07); }

.opp-grid.is-list .opp-thumb {
    flex: 0 0 190px;
    width: 190px;
    aspect-ratio: auto;
    min-height: 130px;
}
.opp-grid.is-list .opp-body { flex: 1 1 auto; padding: 16px 18px; }
.opp-grid.is-list .opp-excerpt {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

@media (max-width: 640px) {
    .opp-grid.is-list .opp-card { flex-direction: row; }
    .opp-grid.is-list .opp-thumb { flex: 0 0 108px; width: 108px; min-height: 108px; }
    .opp-grid.is-list .opp-kind { font-size: 10px; padding: 3px 7px; top: 6px; left: 6px; }
    .opp-grid.is-list .opp-body { padding: 12px; gap: 6px; }
    .opp-grid.is-list .opp-body h3 { font-size: 15px; }
    .opp-grid.is-list .opp-excerpt { display: none; }
    .opp-grid.is-list .opp-meta { font-size: 12px; gap: 6px 10px; }
}

/* resultados / contagem das listagens */
.ed-inst-results { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 0 0 18px; }
.ed-inst-results-title { margin: 0; font-size: 20px; }
.ed-inst-results-count { font-size: 13px; color: #666; }

/* sessoes das paginas individuais (padrao do perfil do criador) */
.ed-ops-sec { margin: 0 0 24px; }
.ed-ops-sec > h2 { margin: 0 0 14px; font-size: 20px; }
.ed-ops-sec > h2 ~ h2 { margin-top: 22px; }
.ed-ops-hero .inst-pro-cover { position: absolute; inset: 0; }
.ed-ops-hero { position: relative; }
.ed-ops-hero .container { position: relative; z-index: 1; }
.ed-ops-hero.is-center .inst-pro-inner { justify-content: center; text-align: center; }
.ed-ops-hero .inst-pro-top-badge {
    display: inline-block; background: rgba(255,255,255,.16);
    padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; margin-bottom: 8px;
}

/* ------------------------------------------------------------------
 * Painel do criador: filtros de oportunidades responsivos
 * (quebram em linhas em vez de estourar o card)
 * ------------------------------------------------------------------ */
.slz7-dash-block .ed-inst-filters:not(.ed-if-style-stack):not(.ed-if-style-split) { flex-wrap: wrap; }
@media (min-width: 901px) {
    .slz7-dash-block .ed-inst-filters:not(.ed-if-style-stack):not(.ed-if-style-split) .ed-if-search { flex: 1 1 100%; min-width: 0; }
    .slz7-dash-block .ed-inst-filters:not(.ed-if-style-stack):not(.ed-if-style-split) .ed-if-locsel { flex: 1 1 150px; min-width: 0; }
    .slz7-dash-block .ed-inst-filters:not(.ed-if-style-stack):not(.ed-if-style-split) .ed-if-tools { flex: 1 1 100%; flex-wrap: wrap; min-width: 0; }
}
@media (max-width: 900px) and (min-width: 561px) {
    .slz7-dash-block .ed-inst-filters .ed-if-locsel { flex: 1 1 calc(50% - 10px); }
}
@media (max-width: 560px) {
    .slz7-dash-block .ed-inst-filters .ed-if-locsel { flex: 1 1 100%; }
}

/* ------------------------------------------------------------------
 * Lista de oportunidades: midia padronizada e cards com mesma altura
 * ------------------------------------------------------------------ */
.opp-grid.is-list .opp-card { height: 200px; }
.opp-grid.is-list .opp-thumb {
    flex: 0 0 200px;
    width: 200px;
    height: 100%;
    min-height: 0;
}
.opp-grid.is-list .opp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.opp-grid.is-list .opp-body {
    flex: 1 1 auto; min-width: 0; overflow: hidden;
    justify-content: center; gap: 6px;
}
.opp-grid.is-list .opp-body h3 {
    display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.opp-grid.is-list .opp-company {
    display: block; max-width: 100%;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.opp-grid.is-list .opp-excerpt { -webkit-line-clamp: 1; }
.opp-grid.is-list .opp-meta { flex-wrap: nowrap; overflow: hidden; }
.opp-grid.is-list .opp-meta > * { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 640px) {
    .opp-grid.is-list .opp-card { height: 136px; }
    .opp-grid.is-list .opp-thumb { flex: 0 0 108px; width: 108px; height: 100%; min-height: 0; }
    .opp-grid.is-list .opp-company { display: none; }
}

/* ------------------------------------------------------------------
 * Botao "Candidatar-se" no resumo lateral das oportunidades
 * ------------------------------------------------------------------ */
.opp-apply { scroll-margin-top: 110px; }
.opp-box .opp-apply-btn { display: flex; width: 100%; justify-content: center; gap: 8px; margin-top: 14px; }
html { scroll-behavior: smooth; }

/* ------------------------------------------------------------------
 * Correcao: na Minha conta os estilos globais de formulario
 * (label{display:block} + input com altura/borda/raio proprios)
 * faziam o input do "ed-if-search" estourar a pilula e cobrir o
 * bloco "ed-if-tools". Aqui o campo de busca volta ao layout inline.
 * ------------------------------------------------------------------ */
.woocommerce-MyAccount-content .ed-inst-filters,
.slz7-dash-block .ed-inst-filters { align-items: center; row-gap: 12px; }

.woocommerce-MyAccount-content .ed-inst-filters .ed-if-search,
.slz7-dash-block .ed-inst-filters .ed-if-search {
    display: flex !important;
    align-items: center;
    height: var(--ed-if-h, 46px);
    min-height: var(--ed-if-h, 46px);
    margin: 0 !important;
    padding: 0 16px;
    overflow: hidden;
}

.woocommerce-MyAccount-content .ed-inst-filters .ed-if-search input,
.woocommerce-MyAccount-content .ed-inst-filters .ed-if-search input[type="search"],
.slz7-dash-block .ed-inst-filters .ed-if-search input,
.slz7-dash-block .ed-inst-filters .ed-if-search input[type="search"] {
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    line-height: normal;
}

.woocommerce-MyAccount-content .ed-inst-filters .ed-if-locsel,
.woocommerce-MyAccount-content .ed-inst-filters .ed-if-sort,
.slz7-dash-block .ed-inst-filters .ed-if-locsel,
.slz7-dash-block .ed-inst-filters .ed-if-sort {
    display: flex !important;
    align-items: center;
    height: var(--ed-if-h, 46px);
    margin: 0 !important;
}

.woocommerce-MyAccount-content .ed-inst-filters select,
.slz7-dash-block .ed-inst-filters select {
    height: var(--ed-if-h, 46px) !important;
    min-height: 0 !important;
    margin: 0 !important;
}

.woocommerce-MyAccount-content .ed-inst-filters .ed-if-tools,
.slz7-dash-block .ed-inst-filters .ed-if-tools { align-items: center; row-gap: 10px; }