/**
 * ATPL Real Estate Platform - Customer UI/UX Stylesheet
 * Optimized for Desktop and Tablet screens
 */

:root {
    --atpl-blue-600: #1d4ed8;
    --atpl-blue-700: #1e40af;
    --atpl-blue-50: #eff6ff;
    --atpl-emerald-600: #059669;
    --atpl-amber-500: #f59e0b;
}

/* Category Quick Banner */
.atpl-category-pill {
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.atpl-category-pill:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);
}

/* Horizontal Search Result Card (Desktop & Tablet) */
.property-horizontal-card {
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.property-horizontal-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -4px rgba(15, 23, 42, 0.08), 0 4px 8px -2px rgba(15, 23, 42, 0.04);
}

@media (min-width: 640px) {
    .property-horizontal-card {
        display: flex;
        flex-direction: row;
        align-items: stretch;
    }
    .property-horizontal-card .card-media {
        width: 260px;
        flex-shrink: 0;
    }
    .property-horizontal-card .card-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
}

@media (min-width: 1024px) {
    .property-horizontal-card .card-media {
        width: 280px;
    }
}

/* Filter Checkbox & Radio Polishing */
.filter-checkbox:checked {
    background-color: #2563eb;
    border-color: #2563eb;
}

/* Spec Pills in Property Detail */
.spec-pill {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 10px 14px;
    text-align: center;
    transition: border-color 0.2s;
}
.spec-pill:hover {
    border-color: #cbd5e1;
}

/* Sticky Contact Seller Card */
.sticky-contact-card {
    position: sticky;
    top: 5rem;
}

/* List Property Wizard Steps */
.step-circle {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.875rem;
    transition: all 0.3s;
}
.step-circle.active {
    background-color: #2563eb;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}
.step-circle.inactive {
    background-color: #f1f5f9;
    color: #64748b;
}

/* Custom Scrollbars */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}