/* Custom CSS for Paws & Home Finder */

/* Color Palette */
:root {
    --main-color: #20c997; /* A friendly, calming teal/aqua */
    --main-alt-color: #fd7e14; /* A warm, energetic orange/gold */
    --light-bg: #f8f9fa;
    --card-hover-shadow: 0 0.5rem 1rem rgba(32, 201, 151, 0.15); /* Soft shadow with main color */
}

/* Apply main colors to Bootstrap classes */
.bg-main {
    background-color: var(--main-color) !important;
}

.text-main {
    color: var(--main-color) !important;
}

.btn-main-alt {
    color: #fff;
    background-color: var(--main-alt-color);
    border-color: var(--main-alt-color);
    transition: all 0.3s ease;
}

.btn-main-alt:hover {
    color: #fff;
    background-color: #e86a00; /* Slightly darker hover */
    border-color: #e86a00;
}

/* NEW: Alternative badge style for Foster Program/Key Feature */
.bg-main-alt {
    background-color: var(--main-alt-color) !important;
    color: white !important;
}


/* Custom Card Styling for Listings */
.shelter-card {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    height: 100%; /* Ensure uniform height in grid */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.shelter-card:hover {
    transform: translateY(-5px); /* Subtle lift on hover */
    box-shadow: var(--card-hover-shadow);
}

.card-header-main {
    background-color: var(--main-color);
    color: white;
    padding: 0.75rem 1rem;
    font-weight: bold;
    border-bottom: none;
}

.card-title {
    color: var(--main-alt-color);
    font-weight: bold;
}

/* Pagination Styling */
.page-item.active .page-link {
    background-color: var(--main-color);
    border-color: var(--main-color);
    color: white;
}

.page-link {
    color: var(--main-color);
}

.page-link:hover {
    color: var(--main-alt-color);
}

/* Adjust width of the state filter dropdown */
.filter-select {
    max-width: 150px; 
}

/* Fixed PayPal Donate Button Styling (Desktop only) */
#paypal-fixed-btn {
    position: fixed;
    bottom: 20px;   /* Distance from the bottom */
    right: 20px;    /* Distance from the right */
    z-index: 1050;  /* Ensure it is above most content */
}
#paypal-fixed-btn .btn {
    background-color: #0070ba; 
    border-color: #0070ba;
    transition: all 0.2s;
}
#paypal-fixed-btn .btn:hover {
    background-color: #00508a; 
    border-color: #00508a;
    transform: scale(1.05);
}

/* Mobile-Friendly Adjustments */
@media (max-width: 991.98px) {
    .filter-select {
        max-width: 100%; 
        border-radius: 0.375rem 0.375rem 0 0 !important; 
    }
    
    .input-group-lg {
        flex-wrap: wrap; 
    }
}