ladowanie ogloszen

frontend/src/styles.css

@@ -26568,6 +26568,107 @@ a.city-card:hover {
   margin-bottom: 18px;
 }
 
+/* Animacja wczytywania ofert - wypelnia miejsce listy, dopoki backend nie odda ogloszen. */
+.listings-loader {
+  align-items: center;
+  background: linear-gradient(180deg, #f6faf7 0%, #ffffff 100%);
+  border: 1px solid #e7eef0;
+  border-radius: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin-top: 18px;
+  padding: 30px 24px 34px;
+  text-align: center;
+}
+
+.listings-loader-art {
+  animation: ll-float 2.6s ease-in-out infinite;
+}
+
+.ll-house {
+  animation: ll-pop 2.6s ease-in-out infinite;
+  transform-origin: 126px 118px;
+}
+
+.ll-cloud-a { animation: ll-drift 5s ease-in-out infinite; }
+.ll-cloud-b { animation: ll-drift 6.5s ease-in-out infinite reverse; }
+
+.listings-loader-title {
+  color: #13243d;
+  font-size: 22px;
+  font-weight: 900;
+  margin: 6px 0 0;
+}
+
+.listings-loader-title span { color: #10a15e; }
+
+.listings-loader-sub {
+  color: #7b8896;
+  font-size: 14px;
+  margin: 0;
+}
+
+.listings-loader-bars {
+  display: flex;
+  gap: 10px;
+  margin-top: 14px;
+}
+
+.listings-loader-bars span {
+  background: #e4ebe6;
+  border-radius: 999px;
+  height: 6px;
+  overflow: hidden;
+  width: 46px;
+}
+
+.listings-loader-bars span::after {
+  animation: ll-fill 1.4s ease-in-out infinite;
+  background: #10a15e;
+  border-radius: inherit;
+  content: '';
+  display: block;
+  height: 100%;
+  transform: translateX(-100%);
+  width: 100%;
+}
+
+.listings-loader-bars span:nth-child(2)::after { animation-delay: 0.18s; }
+.listings-loader-bars span:nth-child(3)::after { animation-delay: 0.36s; }
+.listings-loader-bars span:nth-child(4)::after { animation-delay: 0.54s; }
+
+@keyframes ll-float {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-6px); }
+}
+
+@keyframes ll-pop {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.04); }
+}
+
+@keyframes ll-drift {
+  0%, 100% { transform: translateX(0); }
+  50% { transform: translateX(6px); }
+}
+
+@keyframes ll-fill {
+  0% { transform: translateX(-100%); }
+  55%, 100% { transform: translateX(100%); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .listings-loader-art,
+  .ll-house,
+  .ll-cloud-a,
+  .ll-cloud-b,
+  .listings-loader-bars span::after {
+    animation: none;
+  }
+  .listings-loader-bars span::after { transform: translateX(0); }
+}
+
 .real-listings-heading {
   align-items: center;
   display: flex;
@@ -30956,6 +31057,19 @@ a.listing-detail-back {
 }
 
 /* Widok KOMPAKTOWY: gestsze wiersze, mniejsze zdjecie, bez metadanych. */
+/* Widok LISTA (domyslny): karty nieco wieksze niz bazowe - szersze zdjecie i wyzszy kafelek.
+   Tylko od 761px w gore, zeby nie ruszac ukladu mobilnego (ponizej 760px karty i tak sie skladaja). */
+@media (min-width: 761px) {
+  .result-list.view-lista .result-card {
+    grid-template-columns: 320px minmax(0, 1fr) 190px;
+    min-height: 232px;
+  }
+
+  .result-list.view-lista .result-photo {
+    min-height: 232px;
+  }
+}
+
 .result-list.view-kompaktowa { gap: 8px; }
 
 .result-list.view-kompaktowa .result-card {