/* 
 * Style motywów kolorystycznych dla Lista mieszkań 2
 */

/* Podstawowe zmienne CSS dla motywów kolorystycznych */
:root {
    /* Domyślne wartości dla zmiennych */
    --lm2-header-bg-color: #f8f9fa;
    --lm2-header-text-color: #212529;
    --lm2-even-row-color: #f8f9fa;
    --lm2-hover-color: #e9ecef;
    
    --lm2-button-color: #c2986d;
    
    --lm2-pagination-color: #c2976c;
    --lm2-pagination-text-color: #333;
    --lm2-pagination-hover-color: #c2976c;
    --lm2-pagination-hover-text-color: #fff;
    --lm2-pagination-active-color: #c2976c;
    --lm2-pagination-active-text-color: #fff;
    
    --lm2-info-text-color: #807e7b;
    --lm2-length-text-color: #807e7b;
    --lm2-length-select-border-color: #dee2e6;
    --lm2-length-select-focus-border-color: #c2976c;
}

/* ================ STYLE DLA TABEL ================ */
.lm2-wrapper .lm2-table thead th {
    background-color: var(--lm2-header-bg-color) !important;
    color: var(--lm2-header-text-color) !important;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.lm2-wrapper .lm2-table tbody tr:nth-child(even) {
    background-color: var(--lm2-even-row-color) !important;
    transition: background-color 0.3s ease;
}

.lm2-wrapper .lm2-table tbody tr:hover {
    background-color: var(--lm2-hover-color) !important;
    transition: background-color 0.3s ease;
}

/* ================ STYLE DLA PRZYCISKÓW ================ */
.lm2-wrapper .lm2-btn-primary {
    background-color: var(--lm2-button-color) !important;
    border-color: var(--lm2-button-color) !important;
    transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.lm2-wrapper .lm2-btn-primary:hover {
    filter: brightness(1.1);
    transform: translateY(-1px);
}

.lm2-wrapper .lm2-btn-primary:active {
    filter: brightness(0.9);
    transform: translateY(1px);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}

/* ================ STYLE DLA PAGINACJI ================ */
.lm2-wrapper .dataTables_paginate .paginate_button {
    border-color: var(--lm2-pagination-color) !important;
    color: var(--lm2-pagination-text-color) !important;
    transition: all 0.3s ease !important;
    border-radius: 8px !important;
}

.lm2-wrapper .dataTables_paginate .paginate_button:hover,
.lm2-wrapper .dataTables_paginate .paginate_button:focus {
    background-color: var(--lm2-pagination-hover-color) !important;
    border-color: var(--lm2-pagination-hover-color) !important;
    color: var(--lm2-pagination-hover-text-color) !important;
    transform: translateY(-1px);
}

.lm2-wrapper .dataTables_paginate .paginate_button.current,
.lm2-wrapper .dataTables_paginate .paginate_button.current:hover {
    background-color: var(--lm2-pagination-active-color) !important;
    border-color: var(--lm2-pagination-active-color) !important;
    color: var(--lm2-pagination-active-text-color) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.lm2-wrapper .dataTables_paginate .paginate_button:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset !important;
}

/* ================ STYLE DLA INFORMACJI ================ */
.lm2-wrapper div.dataTables_wrapper div.dataTables_info {
    color: var(--lm2-info-text-color) !important;
    transition: color 0.3s ease;
}

.lm2-wrapper .dataTables_length,
.lm2-wrapper .dataTables_length label {
    color: var(--lm2-length-text-color) !important;
    transition: color 0.3s ease;
}

.lm2-wrapper .dataTables_length select {
    border-color: var(--lm2-length-select-border-color) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    border-radius: 5px;
}

.lm2-wrapper .dataTables_length select:focus {
    border-color: var(--lm2-length-select-focus-border-color) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(var(--lm2-length-select-focus-border-color-rgb, 194, 151, 108), 0.25) !important;
}

/* ================ SPECJALNE STYLE DLA MOTYWÓW ================ */

/* Motyw Złoty (gold) */
.lm2-theme-gold .lm2-status-wolne {
    color: #1e7e34 !important;
    background-color: rgba(30, 126, 52, 0.1) !important;
}

.lm2-theme-gold .lm2-status-zarezerwowane {
    color: #d39e00 !important;
    background-color: rgba(211, 158, 0, 0.1) !important;
}

.lm2-theme-gold .lm2-status-sprzedane {
    color: #bd2130 !important;
    background-color: rgba(189, 33, 48, 0.1) !important;
}

/* Motyw Ciemny (dark) */
.lm2-theme-dark {
    color: #f8f9fa !important;
}

.lm2-theme-dark .lm2-table {
    color: #f8f9fa !important;
}

.lm2-theme-dark .lm2-table tbody tr:nth-child(odd) {
    background-color: #1e2226 !important;
}

.lm2-theme-dark .lm2-status-wolne {
    color: #8fd19e !important;
    background-color: rgba(143, 209, 158, 0.2) !important;
}

.lm2-theme-dark .lm2-status-zarezerwowane {
    color: #ffc107 !important;
    background-color: rgba(255, 193, 7, 0.2) !important;
}

.lm2-theme-dark .lm2-status-sprzedane {
    color: #ea868f !important;
    background-color: rgba(234, 134, 143, 0.2) !important;
}

/* Motyw Zielony (green) */
.lm2-theme-green .lm2-status-wolne {
    color: #155724 !important;
    background-color: rgba(21, 87, 36, 0.1) !important;
}

.lm2-theme-green .lm2-status-zarezerwowane {
    color: #856404 !important;
    background-color: rgba(133, 100, 4, 0.1) !important;
}

.lm2-theme-green .lm2-status-sprzedane {
    color: #721c24 !important;
    background-color: rgba(114, 28, 36, 0.1) !important;
}

/* Motyw Jasny (light) */
.lm2-theme-light .lm2-status-wolne {
    color: #155724 !important;
    background-color: rgba(21, 87, 36, 0.1) !important;
}

.lm2-theme-light .lm2-status-zarezerwowane {
    color: #856404 !important;
    background-color: rgba(133, 100, 4, 0.1) !important;
}

.lm2-theme-light .lm2-status-sprzedane {
    color: #721c24 !important;
    background-color: rgba(114, 28, 36, 0.1) !important;
}

/* Poprawka dla podświetlania aktywnej strony paginacji - Bootstrap struktura */
.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item.active,
.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item.active:hover {
    background-color: var(--lm2-pagination-active-color, #c2976c) !important;
}

.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item.active a.page-link {
    background-color: var(--lm2-pagination-active-color, #c2976c) !important;
    border-color: var(--lm2-pagination-active-color, #c2976c) !important;
    color: var(--lm2-pagination-active-text-color, #fff) !important;
    font-weight: bold !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

/* Style dla linków paginacji */
.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item a.page-link {
    color: var(--lm2-pagination-text-color, #333) !important;
    border-color: var(--lm2-pagination-color, #c2976c) !important;
    border-radius: 8px !important;
    margin: 0 2px !important;
    transition: all 0.2s ease !important;
}

.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item:not(.active) a.page-link:hover {
    background-color: var(--lm2-pagination-hover-color, #c2976c) !important;
    color: var(--lm2-pagination-hover-text-color, #fff) !important;
    transform: translateY(-1px);
}

/* Zatrzymanie stylu Bootstrap który może przesłaniać nasze style */
.lm2-wrapper .dataTables_paginate ul.pagination .paginate_button.page-item.active a.page-link:focus {
    box-shadow: none !important;
}

/* Dodatkowe style dla aktywnej strony */
.lm2-wrapper .dataTables_paginate .page-item.active {
    z-index: 3 !important; /* Wyższy z-index dla elementu aktywnego */
}

/* ================ RESPONSYWNOŚĆ ================ */
@media screen and (max-width: 767px) {
    .lm2-wrapper .lm2-status,
    .lm2-wrapper #lm2-mieszkania-table .lm2-status {
        font-size: 12px !important;
        padding: 4px 8px !important;
    }
    
    .lm2-wrapper .lm2-table-bottom {
        flex-direction: column;
    }
    
    .lm2-wrapper .lm2-table-pagination {
        order: 1;
        margin-bottom: 10px;
    }
    
    .lm2-wrapper .lm2-table-info {
        order: 2;
        text-align: center;
    }
    
    .lm2-wrapper .lm2-table-length {
        order: 3;
        justify-content: center;
    }
    
    .lm2-wrapper .dataTables_paginate .paginate_button:not(.previous):not(.next) {
        display: none !important;
    }
    
    .lm2-wrapper .dataTables_paginate .paginate_button.previous,
    .lm2-wrapper .dataTables_paginate .paginate_button.next {
        display: inline-block;
        flex: 1;
    }
}