/* ===================================================================
   HOMESYA THEME — Real Estate Identity
   Blue/deep-ocean palette for inmobiliaria portal
   =================================================================== */

/* ========== CSS Custom Properties (Homesya Brand) ========== */
:root {
    --hy-primary: #3433b2;
    --hy-primary-light: #5a59d4;
    --hy-primary-dark: #1a365d;
    --hy-secondary: #63b3ed;
    --hy-secondary-light: #90cdf4;
    --hy-accent: #3182ce;
    --hy-gradient: linear-gradient(135deg, #3433b2 0%, #5a59d4 100%);
    --hy-gradient-hover: linear-gradient(135deg, #1a365d 0%, #3182ce 100%);
    --hy-bg: #f0f4f8;
    --hy-surface: #ffffff;
    --hy-surface-warm: #ebf8ff;
    --hy-text: #1a202c;
    --hy-text-secondary: #4a5568;
    --hy-border: #e2e8f0;
    --hy-shadow: rgba(44, 82, 130, 0.12);
    --hy-shadow-lg: rgba(44, 82, 130, 0.2);
    --hy-success: #38a169;
    --hy-warning: #d69e2e;
    --hy-danger: #e53e3e;
    --hy-radius: 12px;
    --hy-radius-lg: 18px;
    --hy-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ========== Global Overrides ========== */
body {
    background: var(--hy-bg);
    font-family: var(--hy-font);
    color: var(--hy-text);
}

a {
    color: var(--hy-primary);
}

a:hover {
    color: var(--hy-primary-dark);
}

::selection {
    background: rgba(44, 82, 130, 0.2);
    color: var(--hy-text);
}

/* ========== Header Overrides ========== */
@media (max-width: 768px) {
    .mobile-menu-header {
        background: var(--hy-gradient) !important;
    }
}

.search-input:focus {
    border-color: var(--hy-primary) !important;
    box-shadow: 0 0 0 3px rgba(44, 82, 130, 0.15) !important;
}

.search-icon-left {
    color: var(--hy-primary) !important;
}

/* Publish button — Homesya blue */
.btn-publish,
.btn-publish-dropdown {
    background: var(--hy-primary) !important;
    border-color: var(--hy-primary) !important;
    color: white !important;
}

.btn-publish:hover,
.btn-publish-dropdown:hover {
    background: var(--hy-primary-dark) !important;
    box-shadow: 0 4px 12px var(--hy-shadow-lg) !important;
}

/* Notification badge */
.notification-bell-badge,
.notification-badge,
.notification-badge-avatar {
    background: linear-gradient(135deg, #e53e3e, #c53030) !important;
}

/* ========== Hero Section ========== */
.hero-section,
.home-hero {
    background: var(--hy-gradient);
}

/* ========== Category Icons ========== */
.category-icon,
.cat-icon {
    background: linear-gradient(135deg, var(--hy-primary) 0%, var(--hy-secondary) 100%);
    color: white;
}

.category-slider-icon {
    background: linear-gradient(135deg, var(--hy-primary) 0%, var(--hy-secondary) 100%) !important;
}

/* ========== Buttons ========== */
.btn-primary,
button[type="submit"]:not(.btn-auth):not(.mobile-menu-close):not(.notification-mark-all-btn) {
    background: var(--hy-gradient);
    border: none;
    color: white;
    border-radius: var(--hy-radius);
    transition: all 0.3s ease;
}

.btn-primary:hover,
button[type="submit"]:not(.btn-auth):not(.mobile-menu-close):not(.notification-mark-all-btn):hover {
    background: var(--hy-gradient-hover);
    box-shadow: 0 4px 15px var(--hy-shadow-lg);
    transform: translateY(-1px);
}

/* ========== Ad Cards (Real Estate optimized) ========== */
.ad-card,
.product-card {
    border-radius: var(--hy-radius);
    border: 1px solid var(--hy-border);
    background: var(--hy-surface);
    transition: all 0.3s ease;
}

.ad-card:hover,
.product-card:hover {
    box-shadow: 0 8px 30px var(--hy-shadow);
    transform: translateY(-2px);
    border-color: rgba(44, 82, 130, 0.25);
}

/* Price tags */
.ad-price,
.price,
.product-price {
    color: var(--hy-primary);
    font-weight: 700;
}

/* Favorite heart */
.fav-btn.active,
.favorite-btn.active {
    color: var(--hy-danger) !important;
}

/* ========== Real Estate specific badges ========== */
.badge-featured,
.badge-premium,
.tag-featured {
    background: var(--hy-gradient);
    color: white;
}

.badge-new,
.tag-new {
    background: var(--hy-success);
    color: white;
}

/* Agency tier badge (PRO/PREMIUM) - mostrado en cards encima del badge operación */
.re-card__tier-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    margin-right: 6px;
}
.re-card__tier-badge i { font-size: 0.65rem; }
.re-card__tier-badge--verificada {
    background: linear-gradient(135deg, #3433b2 0%, #5a59d4 100%);
}
.re-card__tier-badge--premium {
    background: linear-gradient(135deg, #b8860b 0%, #ffd700 100%);
    color: #2c2c2c;
}
.re-card__tier-badge--destacada {
    background: linear-gradient(135deg, #38a169 0%, #68d391 100%);
}

/* Resalte de card entera para inmobiliaria verificada (boost visible en resultados).
   :has() sobre wrappers convencionales; aditivo — si el wrapper difiere, no hace nada. */
.re-card:has(.re-card__tier-badge),
.re-ad-card:has(.re-card__tier-badge),
article:has(> .re-card__tier-badge),
article:has(.re-card__tier-badge--verificada),
article:has(.re-card__tier-badge--premium) {
    border: 1.5px solid #5a59d4 !important;
    box-shadow: 0 4px 16px rgba(90, 89, 212, 0.18) !important;
}
.re-card:has(.re-card__tier-badge--premium),
.re-ad-card:has(.re-card__tier-badge--premium),
article:has(.re-card__tier-badge--premium) {
    border-color: #d4a017 !important;
    box-shadow: 0 4px 16px rgba(212, 160, 23, 0.22) !important;
}

/* Operation type badges */
.badge-sale {
    background: var(--hy-primary);
    color: white;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-rent {
    background: var(--hy-warning);
    color: white;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-share {
    background: var(--hy-success);
    color: white;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Property meta info (m², rooms, bathrooms) */
.property-meta {
    display: flex;
    gap: 12px;
    align-items: center;
    color: var(--hy-text-secondary);
    font-size: 0.85rem;
    padding: 8px 0;
    border-top: 1px solid var(--hy-border);
    margin-top: 8px;
}

.property-meta-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.property-meta-item svg,
.property-meta-item i {
    color: var(--hy-primary);
    font-size: 0.9rem;
}

/* ========== Search Results ========== */
.search-results-count {
    color: var(--hy-primary);
}

.search-filter-tag {
    background: var(--hy-surface-warm);
    border: 1px solid var(--hy-border);
    color: var(--hy-text);
    border-radius: 20px;
}

.search-filter-tag:hover {
    border-color: var(--hy-primary);
    background: rgba(44, 82, 130, 0.05);
}

.search-filter-tag.active {
    background: var(--hy-primary);
    color: white;
    border-color: var(--hy-primary);
}

/* ========== Pagination ========== */
.pagination .page-link {
    color: var(--hy-primary);
    border-radius: 10px;
}

.pagination .page-link:hover {
    background: var(--hy-surface-warm);
}

.pagination .page-item.active .page-link {
    background: var(--hy-gradient);
    border-color: var(--hy-primary);
    color: white;
}

/* ========== Sidebar Filters ========== */
.filter-section h4,
.sidebar-title {
    color: var(--hy-text);
    font-weight: 700;
}

.filter-checkbox:checked {
    accent-color: var(--hy-primary);
}

input[type="range"] {
    accent-color: var(--hy-primary);
}

/* ========== Forms ========== */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--hy-primary) !important;
    box-shadow: 0 0 0 3px rgba(44, 82, 130, 0.1) !important;
    outline: none;
}

/* ========== Footer ========== */
.site-footer,
footer {
    background: #1a365d;
    color: #d4d4d4;
}

.site-footer a,
footer a {
    color: var(--hy-secondary-light);
}

.site-footer a:hover,
footer a:hover {
    color: var(--hy-secondary);
}

/* ========== Floating Action Button ========== */
.fab,
.btn-floating {
    background: var(--hy-gradient) !important;
    box-shadow: 0 4px 20px var(--hy-shadow-lg) !important;
}

/* ========== Toast / Snackbar ========== */
.toast-success {
    background: var(--hy-success);
}

.toast-info {
    background: var(--hy-primary);
}

/* ========== Stats & Counters ========== */
.stats-number,
.counter-value {
    color: var(--hy-primary);
    font-weight: 800;
}

/* ========== Loading Spinner ========== */
.spinner,
.loader {
    border-top-color: var(--hy-primary) !important;
}

/* ========== Breadcrumbs ========== */
.breadcrumb-item a {
    color: var(--hy-primary);
}

.breadcrumb-item.active {
    color: var(--hy-text-secondary);
}

/* ========== User Profile ========== */
.user-profile-header {
    background: var(--hy-gradient);
}

.follow-btn {
    background: var(--hy-primary);
    color: white;
    border: none;
    border-radius: var(--hy-radius);
}

.follow-btn:hover {
    background: var(--hy-primary-dark);
}

/* ========== Scrollbar ========== */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--hy-bg);
}

::-webkit-scrollbar-thumb {
    background: rgba(44, 82, 130, 0.3);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(44, 82, 130, 0.5);
}

/* ========== Animations ========== */
@keyframes homesyaPulse {

    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(44, 82, 130, 0.4);
    }

    50% {
        box-shadow: 0 0 0 10px rgba(44, 82, 130, 0);
    }
}

.homesya-pulse {
    animation: homesyaPulse 2s infinite;
}

/* ========== Smart App Promo Override ========== */
.smart-app-promo {
    background: var(--hy-gradient) !important;
}

/* ========== AdSense container override ========== */
.adsense-container {
    border: 1px solid var(--hy-border);
    border-radius: var(--hy-radius);
    background: var(--hy-surface);
}

/* ========== Trust Section ========== */
.trust-section,
.confianza-section {
    background: var(--hy-gradient);
}

/* ========== Dropdown active states ========== */
.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--hy-surface-warm);
    color: var(--hy-primary);
}

.notification-mark-all-btn {
    color: var(--hy-primary) !important;
}

.notification-dropdown-footer {
    color: var(--hy-primary) !important;
}

/* Logo: SVG mobile / texto desktop */
a.logo .logo-homesya-mobile { display: none !important; }
a.logo .logo-homesya-desktop { display: block !important; }

@media (max-width: 768px) {
    a.logo .logo-homesya-mobile { display: block !important; height: 30px !important; width: auto !important; }
    a.logo .logo-homesya-desktop { display: none !important; }
}

/* ── Bottom nav: Homesya blue en lugar de naranja ── */
@media (max-width: 768px) {
    .bottom-nav-publish i {
        background: var(--hy-gradient) !important;
        box-shadow: 0 3px 12px rgba(52, 51, 178, 0.4) !important;
    }
    .bottom-nav-item.active,
    .bottom-nav-item[aria-current="page"] {
        color: var(--hy-primary) !important;
    }
    .mobile-bottom-nav {
        border-top: 2px solid rgba(52, 51, 178, 0.12);
    }
}

/* ── Secciones debajo del hero en home Homesya ── */
.main-content--homesya .hy-types-grid {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
}
.main-content--homesya .hy-howto {
    padding-top: 36px !important;
    padding-bottom: 44px !important;
}

/* Secciones genéricas de home dentro de Homesya */
@media (max-width: 768px) {
    .main-content--homesya .home-re-types,
    .main-content--homesya .home-latest-published-grouped,
    .main-content--homesya .home-ads-grid,
    .main-content--homesya .home-section-header,
    .main-content--homesya .home-category-section,
    .main-content--homesya .home-donations {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
    .main-content--homesya .home-re-types__inner,
    .main-content--homesya .home-section-header {
        padding-left: 0;
        padding-right: 0;
    }
}