/* ==========================================================================
   1. Kontener tabeli
   ========================================================================== */
.am-apartments-container .am-table-responsive-wrapper {
  border: none !important;
  box-shadow: none !important;
}

/* ==========================================================================
   2. Tabela mieszkań
   ========================================================================== */
.am-apartments-container .am-apartments-table {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
  border: none !important;
}

.am-apartments-table td,
.am-apartments-table th {
  border: none !important;
  vertical-align: middle;
}

.am-apartments-table th {
  background-color: #fff !important;
  font-weight: bold;
  color: #333;
  padding: 12px 10px; 
text-align: left !important;

position: sticky;
top: 0;
z-index: 10;
}

/* ==========================================================================
   3. Kolory wierszy wg statusu
   ========================================================================== */
.am-apartments-table tr.status-wolne td,
.am-apartments-table tr.status-dostepne td {
  background-color: #f2f2f2 !important;
}

.am-apartments-table tr.status-zarezerwowane td {
  background-color: #e3f2fd !important; /* Jaśniejszy niebieski */
}

.am-apartments-table tr.status-sprzedane td {
  background-color: #ffebee !important; /* Jaśniejszy czerwony */
  opacity: 0.7;
}

.am-apartments-table tr.status-wkrotce {
  opacity: 0.7;
  background-color: #f0f6fc;
}

.am-apartments-table tr.status-wkrotce td {
  font-style: italic;
}

/* ==========================================================================
   4. Zaokrąglenie rogów wierszy (POPRAWKA: tylko wiersze danych)
   ========================================================================== */

/* Krok 1: Resetujemy zaokrąglenie dla nagłówków (th), 
   aby mieć pewność, że są prostokątne. */
.am-apartments-table th:first-child,
.am-apartments-table th:last-child {
  border-radius: 0 !important;
}

/* Krok 2: Nadajemy zaokrąglenie tylko komórkom danych (td) */
.am-apartments-table td:first-child {
  border-top-left-radius: 35px !important;
  border-bottom-left-radius: 35px !important;
}

.am-apartments-table td:last-child {
  border-top-right-radius: 35px !important;
  border-bottom-right-radius: 35px !important;
}
/* ==========================================================================
   5. Podświetlenia i animacje
   ========================================================================== */
@keyframes blink-animation {
  0%   { background-color: transparent; }
  50%  { background-color: #a5d6a7; }
  100% { background-color: transparent; }
}

tr.highlighted-row td {
  background-color: #a5d6a7 !important;
  transition: background-color 0.4s ease-in-out;
}

/* ==========================================================================
   6. Kolumny i komórki
   ========================================================================== */
.am-apartments-container .am-apartments-table .am-cell-etap {
  width: 110px;
}

.am-apartments-container .am-apartments-table .am-cell-cena_brutto {
  white-space: nowrap;
}



/* ==========================================================================
   8. Suwaki filtrów
   ========================================================================== */
.am-filter-item-slider {
  width: 100%;
  max-width: 150px;
}

.am-slider-range {
  margin: 10px 0 5px;
}

.ui-slider {
  position: relative;
  text-align: left;
  background: #e9e9e9;
  border-radius: 2px;
  height: 4px;
}

.ui-slider .ui-slider-handle {
  position: absolute;
  z-index: 2;
  width: 16px;
  height: 16px;
  cursor: pointer;
  border-radius: 50%;
  background-color: #3498db;
  border: 2px solid #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
  top: -6px;
  margin-left: -8px;
  outline: none;
}

.ui-slider .ui-slider-range {
  position: absolute;
  z-index: 1;
  display: block;
  background-color: #3498db;
  height: 100%;
  border-radius: 2px;
}

.am-filter-item-slider label {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.am-filter-item-slider .am-slider-value {
  color: #888;
  font-weight: 500;
}

/* ==========================================================================
   9. Kontener filtrów (ZMIENIONE)
   ========================================================================== */

/* --- Styl bazowy dla WSZYSTKICH przycisków filtrów --- */
.am-apartments-container .am-filters-wrapper .am-filters-toggle-button,
.am-apartments-container .am-all-filters-container .am-filters-reset-button, /* Reset jest w innym kontenerze */
.am-apartments-container .am-building-filters .am-building-button {
  background-color: #f2f2f2 !important;
  border: 1px solid transparent !important; /* Dodany przezroczysty border dla stabilności layoutu */
  border-radius: 25px !important; /* Zaokrąglenie jak w wierszach tabeli */
  color: black !important;
  font-size: 16px !important;
  padding: 8px 16px !important;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, border-color 0.2s ease, box-shadow 0.2s ease-in-out;
}

/* --- Styl HOVER dla WSZYSTKICH przycisków filtrów --- */
.am-filters-toggle-button:hover,
.am-filters-reset-button:hover,
.am-building-button:hover {
  background-color: #e8e8e8 !important;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
}

/* --- Styl ACTIVE dla GŁÓWNEGO przycisku "Filtry" (gdy panel jest otwarty) --- */
.am-filters-toggle-button.active {
  background-color: #fff !important;
  border: 1px solid #f2f2f2 !important;
}

/* --- Styl ACTIVE dla przycisków BUDYNKÓW (gdy jest WYBRANY) --- */
/* Zostawiamy stary, kontrastowy styl dla wybranego filtra */
.am-building-button.active {
  background-color: #0073aa !important;
  color: #fff !important;
  border-color: #0073aa !important;
}
 
/* --- Pozostałe style kontenera filtrów --- */
.am-all-filters-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  padding: 15px;
  width: 100%;
  box-sizing: border-box;
}

.am-filters-form {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin: 0;
  width:100%;
  padding: 0 !important;
  background-color: transparent !important;
  border: 0 !important;
align-items: center;
}

.am-building-filters {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.am-building-buttons-wrapper {
  display: flex;
  gap: 8px;
}

/* Sprawia, że przycisk używa flexboxa do ułożenia tekstu i ikony */
.am-filters-toggle-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important; /* Odstęp między tekstem a ikoną */
}

/* Styl samej ikony */
.am-filters-toggle-button .am-filter-icon {
  height: 1em; /* Automatycznie dopasuje się do rozmiaru fontu przycisku */
  width: auto;
  opacity: 0.7; /* Lekko stonowana, jak na zrzucie */
  transition: opacity 0.2s ease;
}

/* Poprawia widoczność ikony po najechaniu lub aktywacji */
.am-filters-toggle-button:hover .am-filter-icon,
.am-filters-toggle-button.active .am-filter-icon {
  opacity: 1;
}

/* ==========================================================================
   10. Promocje
   ========================================================================== */
.am-apartments-table tr.is-promotional td {
  background-color: #f0fff0 !important;
}

.am-apartments-table tr.is-promotional:hover td {
  background-color: #e0f2e0 !important;
}

.am-apartments-table tr.is-promotional .am-cell-cena_brutto .am-price-cell {
  color: #1b5e20;
  font-weight: 700;
}

/* ==========================================================================
   11. Rozwijany widok szczegółowy
   ========================================================================== */

/* --- Główny kontener po rozwinięciu --- */
.am-details-view-row td {
  padding: 0 !important;
  background: #fff !important;
  border-radius: 0 0 8px 8px;
}
.am-details-wrapper {
  padding: 24px 32px;
  border-top: 1px solid #e0e0e0;
}

/* --- Sekcja ze składnikami ceny --- */
.am-all-components-section {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}

/* --- Pojedynczy kafelek (składnik ceny) --- */
.am-detail-item {
  background-color: #f7f7f7;
  border: 1px solid #ededed;
  border-radius: 12px;
  padding: 10px 16px;
  text-align: left;
  min-width: 150px;
}

.am-detail-label {
  display: block;
  font-size: 12px;
  color: #7f8c8d;
  margin-bottom: 4px;
}

.am-detail-value {
  font-size: 16px;
  font-weight: 700;
  color: #2c3e50;
  display: flex;
  align-items: center;
  min-height: 24px;
}
.am-detail-value-wrapper {
  display: flex;
  flex-direction: column;
}
.am-detail-value-names {
  font-size: 14px;
  font-weight: 500;
}
.am-detail-value-price {
  font-size: 12px;
  font-weight: 700;
  color: #7f8c8d;
}


/* --- Specjalny wygląd dla obowiązkowych, niewybranych składników --- */
.am-detail-value.is-placeholder span {
  color: #e74c3c;
  font-weight: 600;
  font-size: 14px;
}

/* --- Przyciski w widoku szczegółowym --- */
.am-add-components-btn,
.am-details-button {
  background-color: #fff !important;
  color: #34495e !important;
  border: 1px solid #e0e0e0 !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 8px !important;
}

.am-add-components-btn:before {
  content: '+';
  font-size: 20px;
  line-height: 1;
}

.am-add-components-btn:hover,
.am-details-button:hover {
  background-color: #f9f9f9 !important;
  border-color: #bdc3c7 !important;
}

/* --- Stopka widoku szczegółowego --- */
.am-details-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 20px;
  border-top: 1px solid #e0e0e0;
  margin-top: 20px;
  flex-wrap: wrap;
  gap: 15px;
}
.am-details-links {
  display: flex;
  gap: 12px;
}

/* --- Całkowita cena --- */
.am-total-price-item {
  text-align: right;
  margin-left: auto;
}
.am-total-price-label {
  font-size: 14px;
  color: #7f8c8d;
  display: block;
}
.am-total-price-value {
  font-size: 24px;
  font-weight: 700;
  color: #2c3e50;
  white-space: nowrap;
}

/* --- Podświetlenie ceny po aktualizacji --- */
.am-price-highlight {
  transition: color 0.2s ease-in-out;
  color: #e67e22 !important;
}


/* ==========================================================================
   12. STYLE: Okno Modalne (Popup) - POPRAWIONA WERSJA
   ========================================================================== */

/* --- Główny kontener --- */
.am-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
  padding: 20px;
  box-sizing: border-box;
}

/* --- Tło --- */
.am-modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}

/* --- Białe okno (treść popupa) --- */
.am-modal-content {
  background-color: #fff;
  padding: 24px 32px;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  width: 100%;
  max-width: 800px;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  position: relative; /* Kluczowe dla poprawnego działania z-index */
  z-index: 1; /* Ustawia okno ponad tłem */
}

/* --- Przycisk zamknięcia --- */
.am-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  background: transparent;
  border: none;
  font-size: 28px;
  line-height: 1;
  color: #aaa;
  cursor: pointer;
  padding: 5px;
}
.am-modal-close:hover {
  color: #333;
}

/* --- Nagłówek --- */
.am-modal-content h4 {
  font-size: 24px;
  font-weight: 700;
  color: #2c3e50;
  margin: 0 0 24px 0;
  padding-right: 30px; /* Space for close button */
}

/* ==========================================================================
   13. STYLE: Zakładki w popupie
   ========================================================================== */
.am-modal-tabs {
  display: flex;
  border-bottom: 1px solid #e0e0e0;
  margin-bottom: 16px;
  flex-wrap: wrap; /* Responsywność na małych ekranach */
}

.am-modal-tab {
  background: none;
  border: none;
  padding: 10px 16px;
  cursor: pointer;
  font-size: 16px;
  color: #7f8c8d;
  position: relative;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px; /* Nakłada się na główną linię */
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
}

.am-modal-tab:hover {
  color: #34495e;
}

.am-modal-tab.active {
  color: #e67e22;
  font-weight: 600;
  border-bottom-color: #e67e22;
}

.am-mandatory-label {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: bold;
  color: #c0392b;
  background-color: #f2e1df;
  border-radius: 10px;
  text-transform: uppercase;
  vertical-align: middle;
}

.am-modal-tab-content {
  display: none;
}
.am-modal-tab-content.active {
  display: block;
}

/* ==========================================================================
   14. STYLE: Lista dodatków w popupie
   ========================================================================== */
.am-modal-body {
  overflow-y: auto;
  padding-right: 10px; /* Space for scrollbar */
}
.am-addon-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.am-addon-item {
  display: flex;
  align-items: center;
  padding: 12px;
  border: 1px solid #ecf0f1;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.am-addon-item:hover {
  background-color: #f9f9f9;
  border-color: #bdc3c7;
}

.am-addon-item input[type="checkbox"] {
  margin-right: 16px;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.am-addon-main {
  flex-grow: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap; /* Responsywność */
}
.am-addon-title {
  font-weight: 500;
  color: #34495e;
}

/* --- Etykiety statusu i promocji --- */
.am-addon-status, .am-addon-promo {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}

.am-addon-item.status-dostepne .am-addon-status { background-color: #2ecc71; }
.am-addon-item.status-zarezerwowane .am-addon-status { background-color: #3498db; }
.am-addon-item.status-sprzedane .am-addon-status { background-color: #e74c3c; }

.am-addon-promo {
  background-color: #16a085;
}

/* --- Ceny i ikony po prawej --- */
.am-addon-pricing {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
  white-space: nowrap;
  padding-left: 10px; /* Odstęp od nazwy */
}
.am-addon-price-wrapper {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap; /* Responsywność */
  justify-content: flex-end;
}
.am-addon-current-price {
  font-size: 16px;
  font-weight: 700;
  color: #2c3e50;
}
.am-addon-regular-price {
  font-size: 14px;
  color: #95a5a6;
  text-decoration: line-through;
}
.am-addon-omnibus, .am-addon-history-btn {
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  line-height: 1;
}
.am-addon-omnibus img, .am-addon-history-btn img {
  width: 20px;
  height: 20px;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}
.am-addon-omnibus:hover img, .am-addon-history-btn:hover img {
  opacity: 1;
}

/* --- Styl dla nieaktywnych dodatków --- */
.am-addon-item.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: #f9f9f9;
}
.am-addon-item.is-disabled:hover {
  border-color: #ecf0f1;
}

/* ==========================================================================
   15. STYLE: Akcje w popupie (przycisk)
   ========================================================================== */
.am-modal-actions {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
  display: flex;
  justify-content: flex-end;
}

.am-button {
  background-color: #3498db;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  transition: background-color 0.2s ease;
}
.am-button:hover {
  background-color: #2980b9;
}

/* ==========================================================================
   16. STYLE: Historia cen (w popupie)
   ========================================================================== */
.am-history-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 16px;
}
.am-history-table th, .am-history-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid #ecf0f1;
}
.am-history-table th {
  background-color: #f9f9f9;
  font-weight: 600;
  color: #7f8c8d;
}
.am-history-table td:last-child {
  text-align: right;
  font-weight: 500;
}

/* ==========================================================================
   17. STYLE: Globalny Tooltip
   ========================================================================== */
#am-global-tooltip {
    position: absolute;
    background-color: #34495e;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    z-index: 100000;
    pointer-events: none;
    line-height: 1.4;
    white-space: nowrap;
}

.am-regular-price {
padding-left:10px;
}

/* ==========================================================================
   18. Wymuszenie szerokości kolumn (FIX dla Sticky Header)
   ========================================================================== */

/* * Usuwamy stary fix, jeśli istnieje. 
 * 'table-layout: fixed' nie jest potrzebny, gdy ręcznie ustawiamy szerokości.
 */
.am-apartments-container .am-apartments-table {
  table-layout: auto !important; /* Pozwalamy tabeli na normalny tryb */
}

/* * Ustawiamy JAWNE szerokości dla każdej kolumny.
 * Nagłówki (th) i komórki (td) otrzymają te same szerokości,
 * ponieważ dzięki poprawce w PHP obie mają teraz te same klasy.
*/
.am-apartments-table .am-cell-lokal { width: 10%; }
.am-apartments-table .am-cell-metraz { width: 12%; }
.am-apartments-table .am-cell-pokoje { width: 8%; }
.am-apartments-table .am-cell-pietro { width: 8%; }
.am-apartments-table .am-cell-cena_brutto { width: 18%; }
.am-apartments-table .am-cell-rzut { width: 8%; }
.am-apartments-table .am-cell-zapytaj { width: 8%; }
.am-apartments-table .am-cell-am_property_status { width: 12%; }

/* * Kolumna z przyciskiem rozwijania. Używamy 'auto' lub małej wartości,
 * aby zajęła tylko tyle miejsca, ile potrzebuje.
*/
.am-apartments-table .am-cell-details-toggle,
.am-apartments-table .am-details-toggle-col {
  width: 6%;
}

/* ==========================================================================
   19. FIX: Reset stylów przycisku rozwijania (Nadpisanie Elementora)
   ========================================================================== */

/* 1. Styl bazowy dla przycisku (wersja z ikoną lub tekstem) 
   Resetujemy style, które Elementor mógł dodać do  */
.am-apartments-table .am-details-toggle {
  background-color: #f2f2f2 !important; /* Ustawia tło, jak w filtrach */
  border: 1px solid transparent !important; /* Usuwa border Elementora */
  border-radius: 8px !important;       /* Nadaje nasze zaokrąglenie */
  box-shadow: none !important;         /* Usuwa cień Elementora */
  padding: 8px !important;             /* Domyślny padding dla ikony */
  line-height: 1 !important;           /* Zapobiega dziwnej wysokości */
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

/* 2. Styl dla wersji przycisku z tekstem ("Więcej") */
.am-apartments-table .am-details-toggle.is-button {
  padding: 8px 14px !important; /* Większy padding, jak w filtrach */
  font-size: 16px !important;
  color: black !important;
}

/* 3. Efekt hover dla obu wersji */
.am-apartments-table .am-details-toggle:hover {
  background-color: #e8e8e8 !important;
  color: black !important;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
}

/* 4. (NAJWAŻNIEJSZE) Reset stylów dla samej IKONY wewnątrz przycisku.
   To usuwa border z samego obrazka . */
.am-apartments-table .am-details-toggle .am-details-toggle-icon-img {
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 !important;
  
  /* Ustawia stały, dobry rozmiar dla ikony */
  width: 1.2em;
  height: 1.2em;
  vertical-align: middle; /* Lepsze wyrównanie */
}

/* ==========================================================================
   20. FIX: Wyrównanie ikonki Omnibus w komórce ceny
   ========================================================================== */

/* 1. Ustawia flexbox na głównym kontenerze w komórce ceny */
.am-apartments-table .am-cell-cena_brutto .am-price-cell {
  display: flex !important;
  align-items: center; /* Wyrównuje elementy pionowo do środka */
  gap: 8px; /* Dodaje mały odstęp między cenami a ikonką */
  flex-wrap: nowrap; /* Zapobiega zawijaniu (chociaż mało prawdopodobne) */
}

/* 2. (Opcjonalnie) Zapewnia, że div z cenami nie rozciąga się niepotrzebnie */
.am-apartments-table .am-cell-cena_brutto .am-price-values {
  flex-grow: 0; /* Nie pozwalamy mu rosnąć */
  flex-shrink: 0; /* Nie pozwalamy mu się kurczyć */
}

/* 3. (Opcjonalnie) Zapewnia, że ikonka tooltipa też się nie rozciąga */
.am-apartments-table .am-cell-cena_brutto .am-tooltip-trigger {
  flex-shrink: 0; /* Zapobiega kurczeniu się ikonki, gdyby brakowało miejsca */
}

/* ==========================================================================
   21. FIX: Style dla sortowalnych nagłówków (Kursory i Strzałki)
   ========================================================================== */

/* 1. Dodaje kursor "łapki" do WSZYSTKICH sortowalnych nagłówków */
.am-apartments-container .am-apartments-table th.sortable {
  cursor: pointer;
  position: relative; /* Potrzebne dla pozycjonowania strzałki */
  padding-right: 20px; /* Dodaje miejsce na strzałkę */
}

/* 2. Styl dla strzałki (pseudo-element ::after) */
.am-apartments-container .am-apartments-table th.sortable::after {
  content: ''; /* Domyślnie puste */
  position: absolute;
  right: 8px; /* Odstęp od prawej krawędzi */
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.8em;
  opacity: 0.5; /* Domyślnie lekko przezroczyste */
  transition: opacity 0.2s ease;
}

/* 3. Wyświetla strzałkę w górę (sortowanie rosnące) */
.am-apartments-container .am-apartments-table th.sortable.sorting-asc::after {
  content: '▲'; /* Można użyć Unicode lub obrazka */
  opacity: 1; /* Pełna widoczność dla aktywnego sortowania */
}

/* 4. Wyświetla strzałkę w dół (sortowanie malejące) */
.am-apartments-container .am-apartments-table th.sortable.sorting-desc::after {
  content: '▼'; /* Można użyć Unicode lub obrazka */
  opacity: 1; /* Pełna widoczność dla aktywnego sortowania */
}

/* 5. (Opcjonalnie) Zwiększa widoczność strzałki po najechaniu na nieaktywny nagłówek */
.am-apartments-container .am-apartments-table th.sortable:not(.sorting-asc):not(.sorting-desc):hover::after {
 /* content: '▲'; Można pokazać domyślną strzałkę na hover */
 /* opacity: 0.8; */
}