/*
 * =========================================================
 * DHOMES SOLUTIONS - Estilos Premium v3 (RESTAURADO)
 * Tema hijo: wpresidence-child
 * =========================================================
 * Principio: el diseño ORIGINAL del tema se respeta en desktop.
 * Las mejoras premium solo son sutiles o móviles.
 */

/* 1) VARIABLE DE GRID (valor corregido) */
:root {
    --wp-estate-main-grid-content-width-option: 1600px;
}

/* =========================================================
 * 2) RESUMEN (OVERVIEW) - tarjetas sutiles en línea
 * ========================================================= */
.single-overview-section.panel-group.property-panel {
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.single-overview-section .panel-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: #062750 !important;
    padding-left: 12px !important;
    border-left: 4px solid #062750 !important;
    margin-bottom: 18px !important;
    line-height: 1.2 !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on) {
    display: inline-flex !important;
    align-items: center !important;
    background: #f8f9fa !important;
    border: 1px solid #eaeaea !important;
    border-radius: 10px !important;
    padding: 10px 16px !important;
    margin: 0 10px 10px 0 !important;
    vertical-align: middle !important;
    transition: all 0.3s ease !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on):hover {
    background: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
    border-color: #062750 !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on) li.first_overview {
    margin: 0 8px 0 0 !important;
    display: flex !important;
    align-items: center !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    height: auto !important;
    width: auto !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on) li.first_overview svg,
.single-overview-section ul.overview_element:not(.overview_updatd_on) li.first_overview svg path {
    fill: #062750 !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on) li.first_overview img {
    width: 20px !important;
    height: 20px !important;
    object-fit: contain !important;
}

.single-overview-section ul.overview_element:not(.overview_updatd_on) li:not(.first_overview) {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333333 !important;
}

.single-overview-section ul.overview_updatd_on {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 14px !important;
    background: #f1f3f5 !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    color: #555555 !important;
    margin: 0 0 14px 0 !important;
    border: none !important;
}

.single-overview-section ul.overview_updatd_on li.first_overview_date {
    font-weight: 700 !important;
    color: #062750 !important;
}

/* =========================================================
 * 3) PESTAÑAS — píldoras elegantes (mismo nav, mejor look)
 * ========================================================= */
.tab_prpg .nav-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    border-bottom: none !important;
    margin-bottom: 25px !important;
    padding-bottom: 0 !important;
}

.tab_prpg .nav-tabs .nav-item {
    flex: 0 0 auto !important;
}

.tab_prpg .nav-tabs .nav-link {
    white-space: nowrap !important;
    padding: 9px 18px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 30px !important;
    background: #f1f3f5 !important;
    border: 1px solid transparent !important;
    color: #495057 !important;
    transition: all 0.2s ease !important;
}

.tab_prpg .nav-tabs .nav-link:hover {
    background: #e9ecef !important;
}

.tab_prpg .nav-tabs .nav-link.active {
    background: #062750 !important;
    color: #ffffff !important;
    border-color: #062750 !important;
    box-shadow: 0 3px 10px rgba(6, 39, 80, 0.18) !important;
}

/* En móvil: una sola línea con scroll horizontal */
@media (max-width: 767px) {
    .tab_prpg .nav-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }
    .tab_prpg .nav-tabs::-webkit-scrollbar {
        display: none !important;
    }
}

/* =========================================================
 * 4) MAPA — altura y borde suave (no afecta inicialización)
 * ========================================================= */
.googleMap_shortcode_class,
.google_map_shortcode_wrapper {
    min-height: 400px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* =========================================================
 * 5) PROPIEDADES SIMILARES — elevación sutil al hover
 * ========================================================= */
#property_similar_listings .property_listing.property_unit_type1 {
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

#property_similar_listings .property_listing.property_unit_type1:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08) !important;
}

/* =========================================================
 * 6) BREADCRUMBS sutiles
 * ========================================================= */
.breadcrumb_container .breadcrumb {
    font-size: 13px !important;
}

.breadcrumb_container .breadcrumb a {
    color: #062750 !important;
}

/* =========================================================
 * 6b) OCULTAR bloque "Actualizado en: [fecha]" (global)
 * ========================================================= */
ul.overview_updatd_on,
.single-overview-section ul.overview_element.overview_updatd_on,
body .single-overview-section ul.overview_updatd_on {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* =========================================================
 * 7) SOLO MÓVIL: fix de badges de energía
 *    (el layout móvil es el original del tema, sin reordenar)
 * ========================================================= */
@media (max-width: 767px) {

    /* Badges de eficiencia energética: no salirse del viewport
       (el tema los posiciona con right negativo y provocan scroll horizontal) */
    .indicator-energy {
        right: 8px !important;
        left: auto !important;
        max-width: calc(100vw - 60px) !important;
        box-sizing: border-box !important;
    }
}

/* =========================================================
 * 8) ANCLAS con offset de header
 * ========================================================= */
#contact, #similar {
    scroll-margin-top: 90px !important;
}