/* =====================================================
VAGAS DO VALE
SISTEMA DE CARDS DE VAGAS
DESIGN PROFISSIONAL
===================================================== */
/* ===============================
GRID PRINCIPAL
================================ */
ul.job_listings.list {
display:grid !important;
grid-template-columns:repeat(4, minmax(250px,1fr)) !important;
gap:22px !important;
width:100% !important;
max-width:1500px !important;
margin:25px auto 0 !important;
padding:0 20px !important;
}
/* Remove padrão WP Job Manager */
ul.job_listings.list li.job_listing {
width:100% !important;
margin:0 !important;
padding:0 !important;
list-style:none !important;
display:flex !important;
}
/* ===============================
CARD
================================ */
.vdv-job-card {
width:100% !important;
min-height:370px !important;
background:#f5f9ff !important;
border:1px solid #dbeafe !important;
border-radius:18px !important;
padding:20px !important;
display:flex !important;
flex-direction:column !important;
box-shadow:
0 5px 18px rgba(0,0,0,.07) !important;
transition:.3s ease !important;
}
.vdv-job-card:hover {
transform:translateY(-5px);
box-shadow:
0 15px 30px rgba(0,0,0,.12) !important;
}
/* ===============================
SELO NOVA
================================ */
.vdv-tags {
min-height:25px !important;
margin-bottom:5px !important;
}
.vdv-tag {
background:#e9ffe9 !important;
color:#1b8d1b !important;
padding:5px 12px !important;
border-radius:20px !important;
font-size:11px !important;
font-weight:800 !important;
}
/* ===============================
LOGO
================================ */
.vdv-logo {
width:85px !important;
height:85px !important;
object-fit:contain !important;
border-radius:50% !important;
background:white !important;
padding:6px !important;
margin:5px auto 15px !important;
display:block !important;
}
/* ===============================
TEXTO
================================ */
.vdv-job-card * {
text-transform:uppercase !important;
}
/* TITULO */
.vdv-title {
font-size:17px !important;
font-weight:800 !important;
line-height:1.3 !important;
height:55px !important;
overflow:hidden !important;
margin:5px 0 10px !important;
}
.vdv-title a {
color:#111827 !important;
text-decoration:none !important;
}
/* EMPRESA */
.vdv-company {
color:#0066ff !important;
font-size:14px !important;
font-weight:700 !important;
height:25px !important;
overflow:hidden !important;
}
/* LOCAL */
.vdv-location {
color:#64748b !important;
font-size:13px !important;
height:25px !important;
}
/* ===============================
INFORMAÇÕES
================================ */
.vdv-meta {
margin:10px 0 !important;
}
.vdv-badge,
.vdv-salary {
background:#e8f1ff !important;
color:#0066ff !important;
padding:6px 12px !important;
border-radius:20px !important;
font-size:12px !important;
font-weight:700 !important;
}
/* DATA */
.vdv-date {
color:#64748b !important;
font-size:12px !important;
margin-top:auto !important;
}
/* ===============================
BOTÃO
================================ */
.vdv-btn {
width:100% !important;
background:#2ad329 !important;
color:#fff !important;
padding:12px !important;
border-radius:30px !important;
text-align:center !important;
font-size:13px !important;
font-weight:800 !important;
margin-top:15px !important;
text-decoration:none !important;
}
.vdv-btn:hover {
background:#20b522 !important;
color:#fff !important;
}
/* ===============================
CARREGAR MAIS
================================ */
.load_more_jobs {
grid-column:1/-1 !important;
background:#2ad329 !important;
color:#fff !important;
border-radius:30px !important;
padding:14px 35px !important;
margin:35px auto !important;
font-weight:800 !important;
}
/* Remove contador */
.showing_jobs,
.job-manager-pagination,
.result-count {
display:none !important;
}
/* ===============================
TABLET
================================ */
@media(max-width:1100px){
ul.job_listings.list {
grid-template-columns:repeat(2,1fr) !important;
}
}
/* ===============================
CELULAR
================================ */
@media(max-width:600px){
ul.job_listings.list {
grid-template-columns:1fr !important;
padding:0 8px !important;
gap:15px !important;
}
ul.job_listings.list li.job_listing {
width:100% !important;
}
.vdv-job-card {
min-height:auto !important;
padding:20px !important;
border-radius:16px !important;
}
.vdv-logo {
width:90px !important;
height:90px !important;
}
.vdv-title {
height:auto !important;
min-height:45px !important;
font-size:18px !important;
}
.vdv-btn {
font-size:14px !important;
padding:13px !important;
}
}
/* =========================================
HEADER MOBILE – VAGAS DO VALE
========================================= */
/* Ajuste geral da header */
@media(max-width:768px){
/* Altura da header */
header,
.elementor-location-header {
min-height:70px !important;
}
/* Container da header */
.elementor-location-header .elementor-container {
padding-left:15px !important;
padding-right:15px !important;
}
/* Logo */
.elementor-location-header img {
max-width:150px !important;
height:auto !important;
}
/* Centraliza logo */
.elementor-location-header .elementor-widget-image {
text-align:left !important;
}
/* Menu mobile */
.elementor-nav-menu–dropdown {
width:100% !important;
left:0 !important;
right:0 !important;
}
/* Links do menu */
.elementor-nav-menu–dropdown a {
padding:15px 20px !important;
font-size:16px !important;
font-weight:600 !important;
}
/* Botões da header */
.elementor-location-header .elementor-button {
padding:10px 15px !important;
font-size:13px !important;
border-radius:25px !important;
}
/* Ícone menu hambúrguer */
.elementor-menu-toggle {
padding:8px !important;
font-size:25px !important;
}
/* Espaçamento dos elementos */
.elementor-location-header .elementor-widget {
margin-bottom:0 !important;
}
}
/* =========================================
CELULAR PEQUENO
========================================= */
@media(max-width:480px){
.elementor-location-header img {
max-width:120px !important;
}
.elementor-menu-toggle {
font-size:22px !important;
}
}
/* ======================================
CENTRALIZAR CIDADE / LOCALIZAÇÃO
====================================== */
.vdv-location,
.job_listing .location,
.job_listing .job-location,
.job_listing .meta .location,
.job_listing .company .location,
.job_listing .location,
.job_listing .location *{
width: 100% !important;
display: block !important;
text-align: center !important;
justify-content: center !important;
align-items: center !important;
margin: 6px auto !important;
float: none !important;
}
/* Caso a localização esteja dentro de uma lista */
.job_listing ul,
.job_listing li{
text-align: center !important;
}
/* =====================================
VAGAS DO VALE – MOBILE COMPACTO
SEM QUEBRAR O LAYOUT
===================================== */
@media (max-width: 767px) {
ul.job_listings.list {
padding: 0 !important;
margin: 0 !important;
}
ul.job_listings li.job_listing {
padding: 8px !important;
margin-bottom: 8px !important;
min-height: auto !important;
height: auto !important;
}
/* Reduz logo */
ul.job_listings li.job_listing img {
max-width: 40px !important;
max-height: 40px !important;
}
/* Diminui título */
ul.job_listings li.job_listing .position h3,
ul.job_listings li.job_listing h3 {
font-size: 13px !important;
line-height: 15px !important;
}
/* Empresa */
ul.job_listings li.job_listing .company {
font-size: 11px !important;
line-height: 14px !important;
}
/* Localização */
ul.job_listings li.job_listing .location {
font-size: 11px !important;
line-height: 14px !important;
}
/* Data */
ul.job_listings li.job_listing .date {
font-size: 10px !important;
}
/* Reduz espaços internos sem quebrar */
ul.job_listings li.job_listing .position,
ul.job_listings li.job_listing .location,
ul.job_listings li.job_listing .company {
margin-top: 2px !important;
margin-bottom: 2px !important;
}
}