/* Casa Veraneio - Stylesheet Baseado no Design Original de 2014 */

/* Reset e Base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --color-primary: #00A67E; /* Verde Teal Principal */
    --color-orange: #FF6B35; /* Laranja para logo */
    --color-white: #FFFFFF;
    --color-dark: #333333;
    --color-light-gray: #F5F5F5;
    --color-border: #E0E0E0;
}

/* Dark Mode */
[data-theme="dark"] {
    --color-primary: #00A67E;
    --color-orange: #FF6B35;
    --color-white: #1a1a1a;
    --color-dark: #f0f0f0;
    --color-light-gray: #2d2d2d;
    --color-border: #404040;
}

/* Aplicar dark mode ao body e elementos principais */
[data-theme="dark"] body {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}

[data-theme="dark"] .main-content {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}

[data-theme="dark"] .container {
    background-color: transparent;
}


[data-theme="dark"] .property-card {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
}

[data-theme="dark"] .property-image {
    background-color: #404040 !important;
}

[data-theme="dark"] .hero {
    background: linear-gradient(135deg, #1a3a5c 0%, #0f2339 100%) !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500"><rect fill="%231a3a5c" width="1200" height="500"/><path d="M0,300 Q300,200 600,300 T1200,300 L1200,500 L0,500 Z" fill="%230f2339" opacity="0.3"/><path d="M0,400 Q400,300 800,400 T1200,400 L1200,500 L0,500 Z" fill="%23002040" opacity="0.2"/></svg>') !important;
}

[data-theme="dark"] .hero-search-box {
    background-color: rgba(26, 26, 26, 0.95) !important;
}

[data-theme="dark"] .search-field label {
    color: #e0e0e0 !important;
    font-weight: 600;
}

[data-theme="dark"] .hero-title {
    color: #ffffff !important;
}

[data-theme="dark"] .search-field select,
[data-theme="dark"] .search-field input {
    background-color: #3d3d3d !important;
    color: #ffffff !important;
    border: 1px solid #555 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
}

[data-theme="dark"] .search-field select:hover,
[data-theme="dark"] .search-field input:hover {
    background-color: #4d4d4d !important;
    border-color: #00A67E !important;
}

[data-theme="dark"] .property-info {
    background-color: #2d2d2d !important;
}

[data-theme="dark"] .properties-grid {
    background-color: #1a1a1a !important;
}

[data-theme="dark"] .search-results-container {
    background-color: #1a1a1a !important;
}

[data-theme="dark"] .filters-sidebar,
[data-theme="dark"] .results-main {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
}

[data-theme="dark"] .property-card-horizontal {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
}

[data-theme="dark"] fieldset,
[data-theme="dark"] .content-section {
    background-color: transparent;
    color: #f0f0f0;
}

[data-theme="dark"] .flash-success {
    background-color: #155724;
    color: #d4edda;
}

[data-theme="dark"] .flash-error {
    background-color: #721c24;
    color: #f8d7da;
}

[data-theme="dark"] .flash-info {
    background-color: #0c5460;
    color: #d1ecf1;
}

[data-theme="dark"] .nav-link {
    color: #e0e0e0 !important;
}

[data-theme="dark"] .nav-link:hover {
    color: #ffffff !important;
    background-color: transparent !important;
}

[data-theme="dark"] .content-title,
[data-theme="dark"] .content-text,
[data-theme="dark"] .property-title,
[data-theme="dark"] .property-location,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] p,
[data-theme="dark"] span,
[data-theme="dark"] div:not(.top-bar):not(.main-nav) {
    color: #e0e0e0;
}

[data-theme="dark"] .property-price {
    color: #00A67E !important;
}

[data-theme="dark"] small,
[data-theme="dark"] .text-muted,
[data-theme="dark"] .property-location,
[data-theme="dark"] .content-text {
    color: #b0b0b0 !important;
}

/* Melhorar contraste em outros elementos comuns */
[data-theme="dark"] .arrow,
[data-theme="dark"] span:not(.nav-link):not(.hero-title) {
    color: #e0e0e0 !important;
}

[data-theme="dark"] table,
[data-theme="dark"] td,
[data-theme="dark"] th {
    background-color: #2d2d2d !important;
    color: #f0f0f0 !important;
    border-color: #404040 !important;
}

[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #2d2d2d !important;
    color: #f0f0f0 !important;
    border-color: #404040 !important;
}

/* Dark Mode Cards - Transformar cards brancos em cinza escuro com borda */
/* Regras genéricas para elementos com background branco em inline styles */
[data-theme="dark"] form[style*="background: white"],
[data-theme="dark"] form[style*="background:white"],
[data-theme="dark"] div[style*="background: white"],
[data-theme="dark"] div[style*="background:white"],
[data-theme="dark"] div[style*="background: #fff"],
[data-theme="dark"] div[style*="background:#fff"],
[data-theme="dark"] div[style*="background: #ffffff"],
[data-theme="dark"] div[style*="background:#ffffff"] {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
    color: #f0f0f0 !important;
}

/* Fieldsets em dark mode */
[data-theme="dark"] fieldset {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
    color: #f0f0f0 !important;
}

[data-theme="dark"] fieldset legend {
    color: #f0f0f0 !important;
}

/* Labels dentro de forms e fieldsets em dark mode */
[data-theme="dark"] form label,
[data-theme="dark"] fieldset label {
    color: #f0f0f0 !important;
}

/* Classe auxiliar para cards escuros */
[data-theme="dark"] .dark-card {
    background-color: #2d2d2d !important;
    border: 1px solid #404040 !important;
    color: #f0f0f0 !important;
}

/* Textos dentro de cards e forms em dark mode */
[data-theme="dark"] form h1,
[data-theme="dark"] form h2,
[data-theme="dark"] form h3,
[data-theme="dark"] form p,
[data-theme="dark"] form span,
[data-theme="dark"] div[style*="background: white"] h1,
[data-theme="dark"] div[style*="background: white"] h2,
[data-theme="dark"] div[style*="background: white"] h3,
[data-theme="dark"] div[style*="background: white"] p,
[data-theme="dark"] div[style*="background: white"] span {
    color: #f0f0f0 !important;
}

/* Textos pequenos e muted dentro de cards */
[data-theme="dark"] form small,
[data-theme="dark"] div[style*="background: white"] small,
[data-theme="dark"] form .text-muted,
[data-theme="dark"] div[style*="background: white"] .text-muted {
    color: #b0b0b0 !important;
}

/* Modais em dark mode */
[data-theme="dark"] .modal,
[data-theme="dark"] div[style*="max-width"][style*="background: white"] {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
    color: #f0f0f0 !important;
}

/* Links dentro de cards em dark mode */
[data-theme="dark"] form a,
[data-theme="dark"] div[style*="background: white"] a {
    color: #00A67E !important;
}

[data-theme="dark"] form a:hover,
[data-theme="dark"] div[style*="background: white"] a:hover {
    color: #00d9a0 !important;
}

/* Exceção: Links/botões com background primary devem manter texto branco */
[data-theme="dark"] a[style*="background: var(--color-primary)"],
[data-theme="dark"] a[style*="background:var(--color-primary)"],
[data-theme="dark"] button[style*="background: var(--color-primary)"],
[data-theme="dark"] button[style*="background:var(--color-primary)"],
[data-theme="dark"] div[style*="background: white"] a[style*="background: var(--color-primary)"],
[data-theme="dark"] div[style*="background:white"] a[style*="background: var(--color-primary)"] {
    color: white !important;
}

/* Estilos específicos para elementos dentro de cards em dark mode */
/* H3 e títulos dentro de cards */
[data-theme="dark"] div[style*="background: white"] h3,
[data-theme="dark"] div[style*="background:white"] h3 {
    color: #f0f0f0 !important;
}

/* Parágrafos com cor #666 em dark mode */
[data-theme="dark"] div[style*="background: white"] p[style*="color: #666"],
[data-theme="dark"] div[style*="background:white"] p[style*="color: #666"],
[data-theme="dark"] div[style*="background: white"] p[style*="color:#666"],
[data-theme="dark"] div[style*="background:white"] p[style*="color:#666"] {
    color: #b0b0b0 !important;
}

/* Textos pequenos com cor #999 em dark mode */
[data-theme="dark"] div[style*="background: white"] p[style*="color: #999"],
[data-theme="dark"] div[style*="background:white"] p[style*="color: #999"],
[data-theme="dark"] div[style*="background: white"] p[style*="color:#999"],
[data-theme="dark"] div[style*="background:white"] p[style*="color:#999"] {
    color: #b0b0b0 !important;
}

/* Backgrounds claros dentro de cards (ex: #f0f0f0, #f8f9fa) */
[data-theme="dark"] div[style*="background: #f0f0f0"],
[data-theme="dark"] div[style*="background:#f0f0f0"],
[data-theme="dark"] div[style*="background: #f8f9fa"],
[data-theme="dark"] div[style*="background:#f8f9fa"] {
    background-color: #404040 !important;
    color: #f0f0f0 !important;
}

/* Regras adicionais para garantir cobertura completa */
/* Cards com border 3px solid (Registrar Propósito) */
[data-theme="dark"] div[style*="background: white"][style*="border: 3px"],
[data-theme="dark"] div[style*="background:white"][style*="border: 3px"] {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
}

/* Containers com max-width e background white (modais, forms) */
[data-theme="dark"] div[style*="max-width"][style*="background: white"],
[data-theme="dark"] div[style*="max-width"][style*="background:white"],
[data-theme="dark"] div[style*="max-width"][style*="background: #fff"],
[data-theme="dark"] div[style*="max-width"][style*="background:#fff"] {
    background-color: #2d2d2d !important;
    border-color: #404040 !important;
}

/* Mensagens de erro/sucesso em dark mode dentro de cards */
[data-theme="dark"] div[style*="background: #f8d7da"],
[data-theme="dark"] div[style*="background:#f8d7da"],
[data-theme="dark"] div[style*="background: #d4edda"],
[data-theme="dark"] div[style*="background:#d4edda"] {
    background-color: #1a1a1a !important;
    border-color: #404040 !important;
}

/* Badges de status dentro de cards */
[data-theme="dark"] span[style*="background: #d4edda"],
[data-theme="dark"] span[style*="background:#d4edda"],
[data-theme="dark"] span[style*="background: #fff3cd"],
[data-theme="dark"] span[style*="background:#fff3cd"],
[data-theme="dark"] span[style*="background: #f8d7da"],
[data-theme="dark"] span[style*="background:#f8d7da"] {
    background-color: #404040 !important;
    color: #f0f0f0 !important;
}

/* Botões com background claro em dark mode */
[data-theme="dark"] a[style*="background: #f8f9fa"],
[data-theme="dark"] a[style*="background:#f8f9fa"],
[data-theme="dark"] button[style*="background: #f8f9fa"],
[data-theme="dark"] button[style*="background:#f8f9fa"] {
    background-color: #404040 !important;
    color: #f0f0f0 !important;
}

/* Botão Editar e outros botões com var(--color-primary) em dark mode */
[data-theme="dark"] a[style*="background: var(--color-primary)"],
[data-theme="dark"] a[style*="background:var(--color-primary)"],
[data-theme="dark"] a[style*="background-color: var(--color-primary)"],
[data-theme="dark"] a[style*="background-color:var(--color-primary)"],
[data-theme="dark"] button[style*="background: var(--color-primary)"],
[data-theme="dark"] button[style*="background:var(--color-primary)"] {
    background-color: #00A67E !important;
    color: white !important;
}

/* Garantir que botões/links com white text sejam sempre visíveis */
[data-theme="dark"] a[style*="color: white"],
[data-theme="dark"] a[style*="color:white"],
[data-theme="dark"] button[style*="color: white"],
[data-theme="dark"] button[style*="color:white"],
[data-theme="dark"] div[style*="background: white"] a[style*="color: white"],
[data-theme="dark"] div[style*="background:white"] a[style*="color: white"] {
    color: white !important;
}

[data-theme="dark"] .footer {
    background-color: #0d1117 !important;
    color: #f0f0f0 !important;
}

[data-theme="dark"] .footer-section a {
    color: #ccc !important;
}

[data-theme="dark"] .footer-section a:hover {
    color: #f0f0f0 !important;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    color: var(--color-dark);
    line-height: 1.6;
    background-color: var(--color-white);
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Top Bar Verde */
.top-bar {
    background-color: var(--color-primary);
    color: var(--color-white);
    padding: 10px 0;
    font-size: 14px;
}

.top-bar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-bar-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.top-bar-left a {
    color: var(--color-white);
    text-decoration: underline;
}

.top-bar-right {
    display: flex;
    gap: 15px;
    align-items: center;
}

.top-bar-right .nav-link {
    color: var(--color-white);
    font-size: 14px;
}

.social-icon {
    color: var(--color-white);
    text-decoration: none;
    font-weight: bold;
    transition: opacity 0.3s;
}

.social-icon:hover {
    opacity: 0.8;
}

/* Navegação Principal */
.main-nav {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-border);
    padding: 15px 0;
}

[data-theme="dark"] .main-nav {
    background-color: #000000 !important;
    border-bottom-color: #333333 !important;
}

[data-theme="dark"] .main-nav .container {
    background-color: transparent !important;
}

[data-theme="dark"] .nav-left {
    background-color: transparent !important;
}

.main-nav .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: 50px;
    width: auto;
}

/* Dark mode logo switching */
[data-theme="dark"] .logo-light {
    display: none !important;
}

[data-theme="dark"] .logo-dark {
    display: block !important;
}

.logo-dark {
    display: none;
}

.nav-right {
    display: flex;
    align-items: center;
    gap: 25px;
}

.nav-link {
    color: var(--color-dark);
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    transition: color 0.3s;
    position: relative;
}

.nav-link:hover {
    color: var(--color-primary);
}

.nav-cta {
    background-color: var(--color-primary);
    color: var(--color-white) !important;
    padding: 8px 20px;
    border-radius: 4px;
}

.nav-cta:hover {
    background-color: #008B6A;
}

/* Property Carousel */
.property-carousel {
    display: flex;
    align-items: center;
    max-width: 400px;
    height: 60px;
    overflow: hidden;
    position: relative;
}

.property-carousel-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    transition: opacity 0.5s ease-in-out;
    cursor: pointer;
    text-decoration: none;
    color: var(--color-dark);
    min-width: 300px;
}

.property-carousel-item:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

.property-carousel-image {
    width: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 4px;
    flex-shrink: 0;
    background-color: #f0f0f0;
}

.property-carousel-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.property-carousel-location {
    font-size: 12px;
    color: var(--color-dark);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.property-carousel-price {
    font-size: 14px;
    color: var(--color-primary);
    font-weight: bold;
}

[data-theme="dark"] .property-carousel-item {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .property-carousel-item:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .property-carousel-location {
    color: #e0e0e0;
}

/* Responsive */
@media (max-width: 768px) {
    .property-carousel {
        max-width: 250px;
    }
    
    .property-carousel-item {
        min-width: 220px;
        padding: 6px 10px;
    }
    
    .property-carousel-image {
        width: 40px;
        height: 40px;
    }
    
    .property-carousel-location {
        font-size: 11px;
    }
    
    .property-carousel-price {
        font-size: 12px;
    }
}

/* Hero Section */
.hero {
    position: relative;
    min-height: 500px;
    background: linear-gradient(135deg, #4A90E2 0%, #357ABD 100%);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500"><rect fill="%234A90E2" width="1200" height="500"/><path d="M0,300 Q300,200 600,300 T1200,300 L1200,500 L0,500 Z" fill="%23357ABD" opacity="0.3"/><path d="M0,400 Q400,300 800,400 T1200,400 L1200,500 L0,500 Z" fill="%2328A745" opacity="0.2"/></svg>');
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.hero-search-box {
    background-color: rgba(51, 51, 51, 0.9);
    padding: 40px;
    border-radius: 8px;
    max-width: 900px;
    width: 100%;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.hero-title {
    color: var(--color-white);
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 30px;
    text-align: center;
}

.search-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
    align-items: end;
}

.search-field {
    display: flex;
    flex-direction: column;
}

.search-field label {
    color: var(--color-white);
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: 500;
}

.search-field select,
.search-field input {
    padding: 12px;
    border: none;
    border-radius: 4px;
    font-size: 15px;
    background-color: var(--color-primary);
    color: var(--color-white);
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 35px;
}

.search-field select:hover,
.search-field input:hover {
    background-color: #008B6A;
}

.search-field select:focus,
.search-field input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 166, 126, 0.3);
}

.search-btn {
    background-color: var(--color-primary);
    color: var(--color-white);
    border: none;
    padding: 12px 30px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
    height: 44px;
}

.search-btn:hover {
    background-color: #008B6A;
}

/* Seção de Conteúdo */
.content-section {
    padding: 60px 20px;
    text-align: center;
}

.content-title {
    font-size: 28px;
    color: var(--color-dark);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.content-title::before {
    content: "🏆";
    font-size: 24px;
}

.content-text {
    max-width: 800px;
    margin: 0 auto 30px;
    font-size: 16px;
    color: #666;
    line-height: 1.8;
}

[data-theme="dark"] .content-text {
    color: #b0b0b0 !important;
}

.cta-button {
    display: inline-block;
    background-color: var(--color-primary);
    color: #ffffff !important;
    padding: 12px 30px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s;
}

.cta-button:hover {
    background-color: #008B6A;
}

/* Dark mode: garantir texto branco em botões CTA */
[data-theme="dark"] .cta-button {
    color: #ffffff !important;
}

/* Garantir texto branco em todos os .cta-button, mesmo com estilos inline */
a.cta-button,
button.cta-button,
.cta-button a,
[data-theme="dark"] a.cta-button,
[data-theme="dark"] button.cta-button,
[data-theme="dark"] .cta-button a {
    color: #ffffff !important;
}

/* Garantir texto branco mesmo quando há estilos inline que sobrescrevem */
a.cta-button[style*="background"],
button.cta-button[style*="background"],
a.cta-button[style*="background-color"],
button.cta-button[style*="background-color"] {
    color: #ffffff !important;
}

/* Regras específicas para .cta-button dentro de cards escuros em dark mode */
[data-theme="dark"] div[style*="background: white"] .cta-button,
[data-theme="dark"] div[style*="background:white"] .cta-button,
[data-theme="dark"] div[style*="background: #fff"] .cta-button,
[data-theme="dark"] div[style*="background:#fff"] .cta-button,
[data-theme="dark"] div[style*="background: #ffffff"] .cta-button,
[data-theme="dark"] div[style*="background:#ffffff"] .cta-button,
[data-theme="dark"] form .cta-button,
[data-theme="dark"] fieldset .cta-button {
    color: #ffffff !important;
}

/* Garantir que links dentro de cards escuros que são .cta-button mantenham texto branco */
[data-theme="dark"] div[style*="background: white"] a.cta-button,
[data-theme="dark"] div[style*="background:white"] a.cta-button,
[data-theme="dark"] form a.cta-button {
    color: #ffffff !important;
}

/* Availability box in dark mode */
[data-theme="dark"] div[style*="background: #d1ecf1"],
[data-theme="dark"] div[style*="background:#d1ecf1"],
[data-theme="dark"] div[style*="background: #e7f3ff"],
[data-theme="dark"] div[style*="background:#e7f3ff"] {
    background-color: #1e3a52 !important;
    border-color: #2d4a66 !important;
    color: #e0f2ff !important;
}

[data-theme="dark"] div[style*="background: #d1ecf1"] h3,
[data-theme="dark"] div[style*="background:#d1ecf1"] h3,
[data-theme="dark"] div[style*="background: #e7f3ff"] h3,
[data-theme="dark"] div[style*="background:#e7f3ff"] h3 {
    color: #ffffff !important;
}

[data-theme="dark"] div[style*="background: #d1ecf1"] p,
[data-theme="dark"] div[style*="background:#d1ecf1"] p,
[data-theme="dark"] div[style*="background: #e7f3ff"] p,
[data-theme="dark"] div[style*="background:#e7f3ff"] p {
    color: #e0f2ff !important;
}

[data-theme="dark"] div[style*="background: #d1ecf1"] p span,
[data-theme="dark"] div[style*="background:#d1ecf1"] p span,
[data-theme="dark"] div[style*="background: #e7f3ff"] p span,
[data-theme="dark"] div[style*="background:#e7f3ff"] p span {
    color: #b3d9ff !important;
}

/* Flash Messages */
.flash-message {
    padding: 15px 0;
    text-align: center;
    font-weight: 500;
}

.flash-success {
    background-color: #d4edda;
    color: #155724;
}

.flash-error {
    background-color: #f8d7da;
    color: #721c24;
}

.flash-info {
    background-color: #d1ecf1;
    color: #0c5460;
}

/* Cards de Imóveis */
.properties-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
    padding: 40px 20px;
}

.property-card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
    cursor: pointer;
}

.property-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

.property-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    background-color: var(--color-light-gray);
    display: block;
    border: none;
    outline: none;
}

.property-info {
    padding: 20px;
}

.property-title {
    font-size: 18px;
    font-weight: bold;
    color: var(--color-dark);
    margin-bottom: 10px;
}

.property-location {
    color: #666;
    font-size: 14px;
    margin-bottom: 10px;
}

.property-price {
    color: var(--color-primary);
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px;
}

/* Footer */
.footer {
    background-color: var(--color-dark);
    color: var(--color-white);
    padding: 40px 20px 20px;
    margin-top: 60px;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 30px;
}

.footer-section h4 {
    margin-bottom: 15px;
    color: var(--color-white);
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 8px;
}

.footer-section a {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-section a:hover {
    color: var(--color-white);
}

.footer-bottom {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #555;
    color: #ccc;
}

/* Responsive */
@media (max-width: 768px) {
    .top-bar .container {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    
    .main-nav .container {
        flex-direction: column;
        gap: 15px;
    }
    
    .nav-right {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .hero-search-box {
        padding: 30px 20px;
    }
    
    .search-form {
        grid-template-columns: 1fr;
    }
    
    .hero-title {
        font-size: 24px;
    }
    
    .properties-grid {
        grid-template-columns: 1fr;
    }
}

/* Main Content */
.main-content {
    min-height: calc(100vh - 300px);
}

/* Search Results Page */
@media (max-width: 768px) {
    .search-results-container > div {
        grid-template-columns: 1fr !important;
    }
    
    .filters-sidebar {
        position: relative !important;
        top: auto !important;
        margin-bottom: 20px;
    }
    
    .property-card-horizontal {
        flex-direction: column !important;
    }
    
    .property-image-container {
        width: 100% !important;
        min-width: 100% !important;
        height: 250px !important;
    }
}