/* Habbi Color Palette - Based on Logo */
:root {
    --habbi-blue-primary: #2B7A9B;
    /* Compatibility: set global --primary for components that use the CSS variable */
    --primary: #2B7A9B;
    --habbi-blue-dark: #234E6D;
    --habbi-blue-light: #3a93ba;
    --habbi-coral: #F48847;
    --habbi-coral-dark: #e67435;
}

/* Primary Buttons */
.bg-primary, .btn-primary {
    background: linear-gradient(135deg, #2B7A9B 0%, #1a5c7a 100%) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(43, 122, 155, 0.3) !important;
}

.bg-primary:hover, .btn-primary:hover {
    background: linear-gradient(135deg, #234E6D 0%, #1a4a5c 100%) !important;
    box-shadow: 0 6px 20px rgba(43, 122, 155, 0.4) !important;
}

/* Accent Buttons (CTA) */
.bg-accent, .btn-accent {
    background: linear-gradient(135deg, #F48847 0%, #e67435 100%) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(244, 136, 71, 0.4) !important;
}

.bg-accent:hover, .btn-accent:hover {
    background: linear-gradient(135deg, #e67435 0%, #d96628 100%) !important;
    box-shadow: 0 6px 20px rgba(244, 136, 71, 0.5) !important;
    transform: translateY(-2px);
}

/* Text Colors */
.text-primary {
    color: #2B7A9B !important;
}

.text-accent {
    color: #F48847 !important;
}

/* Icons */
.text-blue-600, .text-info {
    color: #2B7A9B !important;
}

/* Links */
a:hover, .hover\:text-primary:hover {
    color: #2B7A9B !important;
}

/* Cards and Borders */
.border-primary {
    border-color: #2B7A9B !important;
}

/* Background Gradients */
.bg-gradient-primary {
    background: linear-gradient(135deg, #2B7A9B 0%, #234E6D 100%);
}

.bg-gradient-accent {
    background: linear-gradient(135deg, #F48847 0%, #e67435 100%);
}

/* Property Cards */
.property-card:hover {
    box-shadow: 0 12px 24px rgba(43, 122, 155, 0.2) !important;
}

.property-card:hover .card-title {
    color: #2B7A9B !important;
}

/* Search Tabs */
.search-tab.active {
    color: #2B7A9B !important;
    border-bottom-color: #2B7A9B !important;
}

/* Badges */
.badge-primary {
    background-color: #2B7A9B !important;
    color: white;
}

.badge-accent {
    background-color: #F48847 !important;
    color: white;
}

/* Form Controls Focus */
input:focus, select:focus, textarea:focus {
    border-color: #2B7A9B !important;
    box-shadow: 0 0 0 3px rgba(43, 122, 155, 0.1) !important;
}

/* Spinners and Loaders */
.spinner-border-primary {
    border-color: #2B7A9B;
    border-right-color: transparent;
}