/* assets/nakliye-ilan-goster.css */

/* ... (Filtreleme stilleri aynı kalıyor) ... */
.filter-container-wrapper { margin-bottom: 3rem; border-radius: 0.75rem; overflow: hidden; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05); }
.filter-header { position: relative; padding: 2.5rem 1.5rem; background-color: #111827; color: #fff; text-align: center; overflow: hidden; }
.filter-header::before { content: ''; position: absolute; top: 0; left: 0; width: 200%; height: 100%; background: linear-gradient(110deg, #4f46e5 10%, #1e293b 40%, #1e293b 60%, #06b6d4 90%); background-size: 200% 100%; animation: gradient-animation 15s ease infinite; z-index: 1; }
@keyframes gradient-animation { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.filter-header-content { position: relative; z-index: 2; }
.filter-header h2 { font-size: 2rem; font-weight: 800; margin-bottom: 0.5rem; }
.filter-header p { max-width: 600px; margin: 0 auto; color: #e5e7eb; }
.filter-wrapper { background-color: #fff; padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1024px) { .filter-wrapper { flex-direction: row; align-items: center; } }
.fav-iller-btn { background-color: #FEF3C7; color: #92400E; border: 1px solid #FDE68A; padding: 0.75rem 1rem; border-radius: 0.5rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background-color 0.2s; }
.fav-iller-btn:hover { background-color: #FDE68A; }
.fav-iller-btn i { margin-right: 0.5rem; }
.filter-form { display: flex; flex-direction: column; gap: 1rem; width: 100%; }
@media (min-width: 1024px) { .filter-form { flex-direction: row; } }
.filter-grid-main { display: grid; grid-template-columns: 1fr; gap: 1rem; width: 100%; }
@media (min-width: 640px) { .filter-grid-main { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .filter-grid-main { grid-template-columns: repeat(4, 1fr); } }
.filter-grid-main input, .filter-grid-main select { width: 100%; padding: 0.75rem; border: 1px solid #D1D5DB; border-radius: 0.5rem; transition: border-color 0.2s, box-shadow 0.2s; }
.filter-grid-main input:focus, .filter-grid-main select:focus { outline: none; border-color: #4f46e5; box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2); }
.filter-actions-main { display: flex; gap: 0.75rem; align-items: center; }
.filter-submit-btn, .filter-clear-btn { padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-weight: 600; text-align: center; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: all 0.2s ease-in-out; font-size: 0.9rem; line-height: 1.25rem; }
.filter-submit-btn { background-image: linear-gradient(to right, #4f46e5, #6366f1); color: #fff; border: none; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }
.filter-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.3), 0 4px 6px -2px rgba(79, 70, 229, 0.2); }
.filter-clear-btn { background-color: #fff; color: #4B5563; border: 1px solid #D1D5DB; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05); }
.filter-clear-btn:hover { background-color: #F9FAFB; border-color: #9CA3AF; color: #1F2937; }
.fav-modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); justify-content: center; align-items: center; }
.fav-modal-content { background-color: #fff; padding: 2rem; border-radius: 0.75rem; width: 90%; max-width: 600px; max-height: 80vh; display: flex; flex-direction: column; }
.fav-modal-close { float: right; font-size: 1.5rem; border: none; background: none; cursor: pointer; align-self: flex-end; }
.fav-iller-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.75rem; overflow-y: auto; padding: 1rem; border-top: 1px solid #eee; border-bottom: 1px solid #eee; margin: 1rem 0; }
.fav-save-btn { background-color: #4f46e5; color: #fff; padding: 0.75rem; border: none; border-radius: 0.5rem; font-weight: 600; cursor: pointer; }


/* --- YENİ MİNİMALİST VE RESPONSIVE KART TASARIMI --- */

.ilan-list-container { 
    background-color: #f9fafb; /* gray-50 */
    overflow-x: hidden; /* Yatay kaymayı engeller */
}

.ilan-list-title {
    font-size: 1.75rem; /* Yazı boyutu küçültüldü */
    font-weight: 800;
    color: #1f2937; /* gray-800 */
    text-align: center;
    margin-bottom: 2rem; /* Boşluk azaltıldı */
}
@media (min-width: 768px) { .ilan-list-title { font-size: 2.25rem; } }

.ilan-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem; /* Boşluk azaltıldı */
}
@media (min-width: 768px) { .ilan-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1280px) { .ilan-grid { grid-template-columns: repeat(3, 1fr); } }

.ilan-kart {
    background-color: #ffffff;
    border-radius: 0.5rem; /* Daha keskin kenarlar */
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.07), 0 1px 2px 0 rgba(0,0,0,0.05); /* Daha hafif gölge */
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid #e5e7eb; /* gray-200 */
}
.ilan-kart:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 8px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
}

.ilan-kart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f3f4f6; /* gray-100 */
}

.ilan-tipi-badge {
    background-color: #eef2ff;
    color: #4338ca;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.25rem 0.6rem;
    border-radius: 9999px;
}
.ilan-tarih { font-size: 0.75rem; color: #6b7280; }
.ilan-kart-body { padding: 1rem; flex-grow: 1; }
.ilan-rota-link { text-decoration: none; }
.ilan-rota {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1.25rem;
    transition: color 0.2s ease;
}
.ilan-rota-link:hover .ilan-rota { color: #4f46e5; }
.rota-icon { margin: 0 0.75rem; color: #9ca3af; }

.ilan-detay-grid {
    display: grid;
    /* Mobilde tek sütun */
    grid-template-columns: 1fr;
    gap: 0.75rem;
}
/* Geniş ekranlarda iki sütun */
@media (min-width: 480px) { .ilan-detay-grid { grid-template-columns: 1fr 1fr; } }
.detay-item { display: flex; align-items: center; color: #4b5563; font-size: 0.875rem; }
.detay-item i { color: #a5b4fc; margin-right: 0.5rem; width: 18px; text-align: center; }

.ilan-kart-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background-color: #f9fafb;
    border-top: 1px solid #f3f4f6;
}
.yetkili-bilgi {
    display: flex;
    align-items: center;
    font-weight: 500;
    color: #374151;
    flex-shrink: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 10px;
    font-size: 0.875rem;
}
.yetkili-bilgi i { margin-right: 0.5rem; color: #9ca3af; }
.firma-logo-kucuk { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; margin-right: 0.5rem; border: 1px solid #e5e7eb; }

.footer-actions { display: flex; align-items: center; gap: 0.5rem; }
.action-btn-small {
    width: 32px; height: 32px;
    font-size: 0.9rem;
    /* Diğer stiller aynı */
    display: flex; justify-content: center; align-items: center; border-radius: 50%; text-decoration: none; color: #fff; transition: transform 0.2s ease;
}
.action-btn-small:hover { transform: scale(1.1); }
.detail-btn-main {
    padding: 0.4rem 0.8rem;
    font-size: 0.8rem;
    /* Diğer stiller aynı */
    background-color: #4f46e5; color: #fff; border-radius: 9999px; text-decoration: none; font-weight: 600; transition: background-color 0.2s ease;
}
.detail-btn-main:hover { background-color: #4338ca; }
.call-btn { background-color: #10b981; }
.whatsapp-btn { background-color: #25d366; }

/* ... (Yükleniyor stilleri aynı kalıyor) ... */
.loading-spinner { width: 50px; height: 50px; border: 5px solid #f3f3f3; border-top: 5px solid #4f46e5; border-radius: 50%; margin: 2rem auto; animation: spin 1s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.no-ilan-message { text-align: center; padding: 4rem; background-color: #fff; border-radius: 0.75rem; color: #6b7280; margin-top: 2rem; }