/*
 Theme Name:   My Listing Child
 Theme URI:    https://achesolar.com.br/
 Description:  Child theme for MyListing – Ache Solar (Stitch design). Homepage + Sou Instalador page.
 Author:       Ache Solar
 Author URI:   https://achesolar.com.br/
 Template:     my-listing
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  mylisting-child
*/

/* Parent styles are loaded via functions.php. Custom layout styles in assets/css/home.css and assets/css/instaladores.css */

/* Increase Header Logo Size */
/* Increase Header Logo Size */
body #c27-header .logo img,
body .c27-main-header .logo img,
body .c27-main-header .logo a.static-logo img {
	height: 65px !important;
	max-height: 65px !important;
	width: auto !important;
}
@media screen and (max-width: 1200px) {
	body #c27-header .logo img,
	body .c27-main-header .logo img,
	body .c27-main-header .logo a.static-logo img {
		height: 55px !important;
		max-height: 55px !important;
	}
}
@media screen and (max-width: 480px) {
	body #c27-header .logo img,
	body .c27-main-header .logo img,
	body .c27-main-header .logo a.static-logo img {
		height: 45px !important;
		max-height: 45px !important;
	}
}

/* Hide theme loading overlay so the site does not stay stuck on the spinner (Ache Solar) */
.loader-bg.main-loader {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* Explore shortcode: avoid white page when section loads inside page content */
.sm-explore-shortcode-wrap {
	min-height: 70vh;
	width: 100%;
}
.sm-explore-shortcode-wrap #c27-explore-listings {
	min-height: 60vh;
}
.sm-explore-shortcode-wrap .finder-listings .results-view {
	min-height: 400px;
}

/* ==========================================================================
   Listing Type "Instalador Painel solar" – premium marketplace layout
   Single listing hero/cover + preview cards (Explore / related)
   ========================================================================== */

/* ---------- 1. Hero / Cover (Single Listing Page) ---------- */
.single-job_listing .cover-wrapper,
.single-job_listing .featured-section.profile-cover {
	height: 380px !important;
	min-height: 380px !important;
	padding-bottom: 0 !important;
	position: relative;
	overflow: hidden;
}

.single-job_listing .featured-section.profile-cover-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.single-job_listing .featured-section.profile-cover-gallery .header-gallery-carousel .item {
	min-height: 380px;
}

@media (max-width: 768px) {
	.single-job_listing .cover-wrapper,
	.single-job_listing .featured-section.profile-cover {
		height: 280px !important;
		min-height: 280px !important;
	}
	.single-job_listing .featured-section.profile-cover-gallery .header-gallery-carousel .item {
		min-height: 280px;
	}
}

.single-job_listing .cover-overlay,
.single-job_listing .featured-section.profile-cover .overlay {
	background: rgba(0, 0, 0, 0.45) !important;
	opacity: 1 !important;
}

.single-job_listing .cover-wrapper.no-image,
.single-job_listing .featured-section.profile-cover-no-img {
	background: linear-gradient(135deg, #f6b73c 0%, #f7941d 50%, #f15a24 100%);
}

/* ---------- 3 & 5. Preview Card (Explore / Related Listings) ---------- */
.job_listing .lf-item,
.finder-listings .lf-item,
.c27-explore-listings .lf-item {
	height: 260px;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
	transition: transform 0.2s ease;
}

.job_listing .lf-item:hover,
.finder-listings .lf-item:hover,
.c27-explore-listings .lf-item:hover {
	transform: translateY(-4px);
}

.job_listing .lf-item .overlay,
.finder-listings .lf-item .overlay,
.c27-explore-listings .lf-item .overlay {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.2));
}

.job_listing .lf-item h3,
.job_listing .lf-item h4.listing-preview-title,
.job_listing .lf-item .case27-primary-text,
.finder-listings .lf-item h3,
.finder-listings .lf-item h4.listing-preview-title,
.c27-explore-listings .lf-item h3,
.c27-explore-listings .lf-item h4.listing-preview-title {
	font-size: 20px;
	font-weight: 600;
}

.job_listing .lf-item .location,
.job_listing .lf-item .lf-contact,
.finder-listings .lf-item .location,
.finder-listings .lf-item .lf-contact,
.c27-explore-listings .lf-item .location,
.c27-explore-listings .lf-item .lf-contact {
	font-size: 14px;
	opacity: 0.9;
}

/* ---------- CTA Registro Empresa (Single Listing) ---------- */
.solar-cta-register {
	text-align: center;
	padding: 50px 20px;
	margin: 60px 0;
	background: linear-gradient(135deg, #f6b73c 0%, #f7941d 50%, #f15a24 100%);
	border-radius: 16px;
	color: #fff;
}

.solar-cta-register h3 {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 10px;
}

.solar-cta-register p {
	font-size: 16px;
	margin-bottom: 20px;
	opacity: 0.95;
}

.solar-cta-btn {
	display: inline-block;
	background: #fff;
	color: #f15a24;
	padding: 14px 30px;
	border-radius: 10px;
	font-weight: 600;
	text-decoration: none;
	transition: all 0.2s ease;
}

.solar-cta-btn:hover {
	background: #222;
	color: #fff;
}

/* ==========================================================================
   Single Listing Page – UX: typography, spacing, contact grid (white, shadow, hover)
   ========================================================================== */

/* ---------- 1. Company name: 32–36px ---------- */
.single-job_listing .listing-main-info .profile-name h1.case27-primary-text,
.single-job_listing .listing-main-info h1 {
	font-size: clamp(28px, 4vw, 36px);
	font-weight: 600;
	line-height: 1.2;
	margin-bottom: 0.35em;
}

/* ---------- 2. Section titles: menor (colunas) ---------- */
.single-job_listing .element .pf-head h5,
.single-job_listing .element .title-style-1 h5,
.single-job_listing .pf-head .title-style-1 h5 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}

/* ---------- 3. Body text: 16px ---------- */
.single-job_listing .pf-body,
.single-job_listing .element .pf-body,
.single-job_listing .pf-body .wp-editor-content,
.single-job_listing .pf-body p {
	font-size: 16px;
	line-height: 1.6;
}

/* ---------- 4. Meta info: 14px ---------- */
.single-job_listing .pa-below-title,
.single-job_listing .profile-tagline.listing-tagline-field,
.single-job_listing .lmb-label,
.single-job_listing .listing-main-buttons .value {
	font-size: 14px;
}

/* ---------- 5. More vertical spacing (white space = luxo) ---------- */
.single-job_listing .i-section {
	padding-top: 48px;
	padding-bottom: 48px;
}
.single-job_listing .element {
	margin-bottom: 32px;
}
.single-job_listing .element .pf-body {
	padding-top: 16px;
}

/* ---------- 6. Contact / details blocks: grid elegante, fundo branco, sombra leve, hover ---------- */
.single-job_listing #c27-single-listing .element {
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	border-radius: 12px;
	padding: 24px 28px;
	transition: box-shadow 0.25s ease, transform 0.2s ease;
}
.single-job_listing #c27-single-listing .element:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Grid elegante para listas de detalhes (Website, Endereço, Telefone, etc.) */
.single-job_listing .pf-body .outlined-list.details-list,
.single-job_listing .pf-body .outlined-list.details-block-content,
.single-job_listing .pf-body ul.details-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.single-job_listing .pf-body .outlined-list.details-list li,
.single-job_listing .pf-body .outlined-list.details-block-content li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	background: #f8fafc;
	border-radius: 10px;
	transition: background 0.2s ease, box-shadow 0.2s ease;
}
.single-job_listing .pf-body .outlined-list.details-list li:hover,
.single-job_listing .pf-body .outlined-list.details-block-content li:hover {
	background: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.single-job_listing .pf-body .outlined-list.details-list li i,
.single-job_listing .pf-body .outlined-list.details-block-content li i,
.single-job_listing .pf-body .outlined-list .term-icon {
	flex-shrink: 0;
	font-size: 20px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
	color: var(--accent, #0080d7);
}
.single-job_listing .pf-body .outlined-list a {
	text-decoration: none;
	color: inherit;
}
.single-job_listing .pf-body .outlined-list .wp-editor-content,
.single-job_listing .pf-body .outlined-list span {
	font-size: 15px;
	line-height: 1.5;
}

/* ---------- 7. Cores nos ícones dos títulos das colunas (favicons) ---------- */
.single-job_listing .sm-block-website .pf-head .title-style-1 i,
.single-job_listing .sm-block-website .pf-head i { color: #2563eb !important; }
.single-job_listing .sm-block-location .pf-head .title-style-1 i,
.single-job_listing .sm-block-location .pf-head i,
.single-job_listing .sm-block-endereco .pf-head .title-style-1 i,
.single-job_listing .sm-block-endereco .pf-head i { color: #dc2626 !important; }
.single-job_listing .sm-block-facebook .pf-head .title-style-1 i,
.single-job_listing .sm-block-facebook .pf-head i { color: #1877f2 !important; }
.single-job_listing .sm-block-instagram .pf-head .title-style-1 i,
.single-job_listing .sm-block-instagram .pf-head i { color: #e4405f !important; }
.single-job_listing .sm-block-email .pf-head .title-style-1 i,
.single-job_listing .sm-block-email .pf-head i { color: #0ea5e9 !important; }
.single-job_listing .sm-block-sobre .pf-head .title-style-1 i,
.single-job_listing .sm-block-sobre .pf-head i { color: #0d9488 !important; }
.single-job_listing .sm-block-reivindicar .pf-head .title-style-1 i,
.single-job_listing .sm-block-reivindicar .pf-head i { color: #1e293b !important; }
.single-job_listing .sm-block-code .pf-head .title-style-1 i,
.single-job_listing .sm-block-code .pf-head i { color: #f59e0b !important; }
/* Ícones dentro dos itens da lista (grid) – cores por tipo de link */
.single-job_listing .pf-body .outlined-list a[href*="facebook"] i,
.single-job_listing .pf-body .outlined-list a[href*="facebook"] .term-icon { color: #1877f2 !important; }
.single-job_listing .pf-body .outlined-list a[href*="instagram"] i,
.single-job_listing .pf-body .outlined-list a[href*="instagram"] .term-icon { color: #e4405f !important; }
.single-job_listing .pf-body .outlined-list a[href*="linkedin"] i { color: #0a66c2 !important; }
.single-job_listing .pf-body .outlined-list a[href^="mailto"] i { color: #0ea5e9 !important; }

/* Links clicáveis: garantir que não há overlay a bloquear (qualquer página com listing) */
#c27-single-listing .pf-body a[href^="http"],
#c27-single-listing .pf-body a[href^="mailto:"],
#c27-single-listing .details-list a[href],
#c27-single-listing .details-block-content a[href],
#c27-single-listing .element a[href^="http"],
#c27-single-listing .element a[href^="mailto:"] {
	cursor: pointer !important;
	pointer-events: auto !important;
	position: relative;
	z-index: 10;
}
#c27-single-listing .details-block-content li span,
#c27-single-listing .pf-body .wp-editor-content {
	position: relative;
	z-index: 1;
}

@media (max-width: 768px) {
	.solar-cta-register {
		padding: 36px 16px;
		margin: 40px 0;
	}
	.solar-cta-register h3 {
		font-size: 20px;
	}
	.solar-cta-register p {
		font-size: 15px;
	}
	.solar-cta-btn {
		padding: 12px 22px;
		font-size: 15px;
	}
	.single-job_listing .pf-body .outlined-list.details-list,
	.single-job_listing .pf-body .outlined-list.details-block-content {
		grid-template-columns: 1fr;
	}
	.single-job_listing .i-section {
		padding-top: 36px;
		padding-bottom: 36px;
	}
}

/* ==========================================================================
   Solar Lead CTA (botão / link de lead)
   ========================================================================== */
/* Tirar o quadrado branco: quando o botão ou o banner B2B está dentro de um .element */
#c27-single-listing .element:has(.solar-lead-cta),
#c27-single-listing .element:has(.solar-b2b-banner),
.single-job_listing .element:has(.solar-lead-cta),
.single-job_listing .element:has(.solar-b2b-banner) {
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	border-radius: 0;
}
#c27-single-listing .element:has(.solar-lead-cta) .pf-head,
#c27-single-listing .element:has(.solar-b2b-banner) .pf-head,
.single-job_listing .element:has(.solar-lead-cta) .pf-head,
.single-job_listing .element:has(.solar-b2b-banner) .pf-head {
	display: none;
}
#c27-single-listing .element:has(.solar-lead-cta) .pf-body,
#c27-single-listing .element:has(.solar-b2b-banner) .pf-body,
.single-job_listing .element:has(.solar-lead-cta) .pf-body,
.single-job_listing .element:has(.solar-b2b-banner) .pf-body {
	padding: 0;
}

.solar-lead-cta {
	margin: 30px 0;
}

.solar-lead-button {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: linear-gradient(135deg, #facc15, #f59e0b);
	padding: 18px 24px;
	border-radius: 14px;
	text-decoration: none;
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
	transition: all 0.25s ease;
	color: #1e293b;
}

.solar-lead-button:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);
}

.solar-lead-text strong {
	display: block;
	font-size: 18px;
	font-weight: 600;
}

.solar-lead-text span {
	font-size: 14px;
	opacity: 0.85;
}

.solar-lead-arrow {
	font-size: 22px;
	font-weight: bold;
}

/* ==========================================================================
   Solar B2B Banner
   ========================================================================== */
.solar-b2b-banner {
	position: relative;
	background: #ffffff;
	border-radius: 18px;
	padding: 70px 40px;
	margin-bottom: 48px;
	overflow: hidden;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
	text-align: center;
}

/* Background pattern: apenas .solar-b2b-banner (sem alterar layout global) */
.solar-b2b-banner::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("/wp-content/uploads/solar-fallback/solar-1.jpg") center/cover no-repeat;
	background-size: cover;
	opacity: 0.26;
	pointer-events: none;
	filter: brightness(1.15) contrast(0.6) saturate(0.7) blur(0.5px);
}
/* Opcional: depois de gerar solar-pattern.png (script em wp-content/uploads/create-solar-pattern.py),
   troque a URL acima para: url("/wp-content/uploads/solar-pattern.png") e remova o filter. */

/* Conteúdo acima */
.solar-b2b-content {
	position: relative;
	z-index: 2;
}

.solar-b2b-banner h2 {
	font-size: 30px;
	font-weight: 600;
	color: #1e293b;
	margin-bottom: 15px;
}

.solar-b2b-banner p {
	font-size: 16px;
	color: #000000;
	margin-bottom: 30px;
}

.solar-b2b-bullets {
	list-style: none;
	margin: 0 0 28px 0;
	padding: 0;
	text-align: center;
}

.solar-b2b-bullets li {
	position: relative;
	display: inline-block;
	margin: 0 16px 8px 0;
	padding-left: 24px;
	font-size: 15px;
	color: #1e293b;
	font-weight: 500;
}

.solar-b2b-bullets li:last-child {
	margin-right: 0;
}

.solar-b2b-bullets li::before {
	content: "✔";
	position: absolute;
	left: 0;
	color: #16a34a;
	font-size: 14px;
	font-weight: 700;
}

.solar-b2b-btn {
	display: inline-block;
	background: #facc15;
	color: #1e293b;
	padding: 14px 30px;
	border-radius: 10px;
	font-weight: 600;
	text-decoration: none;
	transition: all 0.25s ease;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.solar-b2b-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

/* ==========================================================================
   Claim business
   ========================================================================== */
.claim-business-wrapper {
	margin-top: 15px;
}

.claim-business-btn {
	display: inline-block;
	padding: 10px 20px;
	border-radius: 8px;
	background: #1e293b;
	color: #ffffff;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.25s ease;
}

.claim-business-btn:hover {
	background: #0f172a;
	transform: translateY(-2px);
}