/* Swiper Custom Styles */

@font-face {
    font-family: VAZIR;
    src: url('../fonts/vazir/Vazir.eot');
    src: url('../fonts/vazir/Vazir.eot?#iefix') format('embedded-opentype'), url('../fonts/vazir/Vazir.woff') format('woff'), url('../fonts/vazir/Vazir.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: VAZIR;
}

.swiper-container {
    width: 100%;
    padding: 20px 0;
}

.swiper-slide {
    height: auto;
}

.swiper-button-next,
.swiper-button-prev {
    color: #4F46E5;
    background: white;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 18px;
}

.swiper-button-next {
    right: 10px;
}

.swiper-button-prev {
    left: 10px;
}

.swiper-pagination-bullet {
    background: #4F46E5;
}

.swiper-pagination-bullet-active {
    background: #4F46E5;
}


/* Property Card Styles */

.property-card {
    transition: transform 0.2s;
}

.property-card:hover {
    transform: translateY(-5px);
}


/* Search Form Styles */

#search-form {
    transition: all 0.3s ease-in-out;
}

#search-form.translate-y-0 {
    transform: translateY(0);
    opacity: 1;
}

#search-form.-translate-y-full {
    transform: translateY(-100%);
    opacity: 0;
}


/* Category Sidebar Styles */

.category-sidebar {
    position: sticky;
    top: 20px;
}


/* Responsive Styles */

@media (max-width: 768px) {
    .swiper-button-next,
    .swiper-button-prev {
        display: none;
    }
}

.form-label {
    @apply block text-sm font-medium text-gray-700 mb-1;
}

.form-input {
    @apply w-full rounded-lg border-gray-300 shadow-sm focus: border-blue-500 focus: ring focus: ring-blue-200 focus: ring-opacity-50;
}

.form-error {
    @apply text-red-600 text-sm mt-1;
}

.form-checkbox {
    @apply rounded text-blue-600 shadow-sm focus: border-blue-300 focus: ring focus: ring-offset-0 focus: ring-blue-200 focus: ring-opacity-50;
}

.transaction-type-card {
    @apply flex items-center p-4 border-2 border-gray-200 rounded-xl cursor-pointer transition-all duration-200;
}

.transaction-type-card:hover {
    @apply border-blue-300 shadow-md;
}

.transaction-type-card.selected-transaction {
    @apply border-blue-500 bg-blue-50;
}

.transaction-icon {
    @apply w-12 h-12 rounded-full flex items-center justify-center mr-3 transition-all duration-200;
}

.transaction-content {
    @apply flex-grow;
}

.transaction-indicator {
    @apply text-blue-500 opacity-0 transition-opacity duration-200;
}

.transaction-type-card.selected-transaction .transaction-indicator {
    @apply opacity-100;
}

.property-type-card.selected-property {
    @apply border-blue-500;
}

.pagination {
    @apply flex justify-center mt-6;
}

.pagination li {
    @apply mx-1;
}

.pagination li a,
.pagination li span {
    @apply px-4 py-2 rounded-lg border border-gray-300 bg-white text-gray-700 inline-flex items-center justify-center hover: bg-gray-50 transition;
}

.pagination li.active span {
    @apply bg-blue-600 text-white border-blue-600;
}

.pagination li.disabled span {
    @apply bg-gray-100 text-gray-400 cursor-not-allowed;
}

.rent-type-card {
    @apply flex items-center p-4 border-2 border-gray-200 rounded-xl cursor-pointer transition-all duration-200 bg-white shadow-sm hover: shadow-md;
}

.rent-type-card:hover {
    @apply border-purple-300;
}

.rent-type-card.selected-rent-type {
    @apply border-purple-500 bg-purple-50;
}

.rent-icon {
    @apply w-12 h-12 rounded-full flex items-center justify-center mr-3 transition-all duration-200;
}

.rent-content {
    @apply flex-grow;
}

.rent-indicator {
    @apply text-purple-500 opacity-0 transition-opacity duration-200;
}

.rent-type-card.selected-rent-type .rent-indicator {
    @apply opacity-100;
}

.property-type-card.selected-property {
    @apply border-purple-500;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.favorite-btn.active {
    @apply bg-red-50 text-red-600 border-red-200;
}

.favorite-btn.active i {
    @apply text-red-600;
}

.favorite-btn.active span {
    @apply text-red-600;
}

.swiper-slide-thumb-active {
    border-color: #8b5cf6 !important;
    opacity: 1 !important;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.favorite-btn.active {
    background-color: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.favorite-btn.active i {
    color: #ef4444;
}

.pagination-wrapper .pagination {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.25rem;
}

.pagination-wrapper .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    background-color: white;
    border: 1px solid #e5e7eb;
    color: #374151;
    border-radius: 0.5rem;
    transition: all 0.2s;
}

.pagination-wrapper .page-item.active .page-link {
    background-color: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

.pagination-wrapper .page-item:hover .page-link {
    background-color: #f3f4f6;
}

.pagination-wrapper .page-item.disabled .page-link {
    color: #9ca3af;
    cursor: not-allowed;
}

.pagination-wrapper .pagination {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.25rem;
}

.pagination-wrapper .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    background-color: white;
    border: 1px solid #e5e7eb;
    color: #374151;
    border-radius: 0.5rem;
    transition: all 0.2s;
}

.pagination-wrapper .page-item.active .page-link {
    background-color: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

.pagination-wrapper .page-item:hover .page-link {
    background-color: #f3f4f6;
}

.pagination-wrapper .page-item.disabled .page-link {
    color: #9ca3af;
    cursor: not-allowed;
}