/* /opt/lampp/htdocs/bizskan/css/custom-style.css */

/* 1. Definicja subtelniejszej palety kolorów i ogólnych stylów */
:root {
    --bs-primary: #4C6EF5; /* Bardziej stonowany, nowoczesny niebieski */
    --bs-primary-rgb: 76, 110, 245;
    --bs-secondary: #6c757d;
    --bs-light: #fdfdff; /* Czysta, prawie biała szarość dla tła komponentów */
    --bs-body-bg: #fef0de/* Lekko niebieskawe, bardzo jasne tło dla całej strony */
    --bs-border-color: #dee2e6;
    --bs-border-radius: 0.375rem; /* Standardowe zaokrąglenie */
    --bs-box-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .065);
    --bs-box-shadow: 0 .2rem 1rem rgba(0, 0, 0, .1);
}

body {
    background-color: var(--bs-body-bg);
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

/* Import czcionki Roboto dla spójnego wyglądu */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');


/* Poprawka tła dla menu rozwijanego w nawigacji */
.dropdown-menu {
    background-color: var(--bs-light);
    border: 1px solid #e9ecef;
    box-shadow: var(--bs-box-shadow);
}


/* 2. Subtelniejsza nawigacja */
.navbar.bg-light {
    background-color: var(--bs-light) !important;
    border-bottom: 1px solid #e9ecef;
}

/* 3. Ulepszone przyciski */
.btn {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
    box-shadow: var(--bs-box-shadow-sm);
    border: none;
}

.btn:hover {
    /* Efekt lekkiego uniesienia przycisku */
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.btn-primary {
    background-color: var(--bs-primary);
}

.btn-primary:hover {
    background-color: #3b5bdb; /* Lekko ciemniejszy przy najechaniu */
}


/* 4. Bardziej czytelne tabele */
.table {
    border-collapse: separate; /* Umożliwia zaokrąglenie rogów */
    border-spacing: 0;
    width: 100%;
    background-color: #ffffff; /* Białe tło bezpośrednio na tabeli */
    border-radius: var(--bs-border-radius); /* Zaokrąglenie rogów tabeli */
}

.table > thead > tr > th {
    background-color: transparent;
    border-width: 0; /* Usunięcie wszystkich obramowań nagłówka */
    color: #636669;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.2px;
    text-align: left; /* Wyrównanie nagłówków do lewej */
    margin-left: 0;
    padding-left: 0.7rem;

}

.table > tbody > tr > td {
    vertical-align: middle;
    border-bottom: 1px solid #eff2f7; /* Delikatna linia pod rekordem */
    background-color: #ffffff; /* Gwarancja białego tła dla komórek danych */
    font-size: 0.95rem; /* Odrobinę mniejsza czcionka dla rekordów */
}

.table > :not(caption) > * > * {
    padding: 0.6rem 0.9rem; /* Zmniejszenie pionowego odstępu w komórkach */

}

.table-hover > tbody > tr:hover {
    background-color: #f8f9fe; /* Jaśniejszy, subtelniejszy kolor podświetlenia wiersza */
}


/* 5. Subtelne cienie dla kart i okien modalnych */
.card, .modal-content {
    border: none;
    background-color: #ffffff; /* Gwarancja białego tła dla całego modala */
    box-shadow: var(--bs-box-shadow);
}

.card-header, .modal-header {
    background-color: #ffffff; /* Zmiana na czystą biel dla spójności */
    border-bottom: 1px solid #eff2f7;
}

.card-body {
    background-color: #ffffff; /* Białe tło dla treści karty/modala */
}

.modal-footer, .card-footer {
    background-color: #ffffff; /* Ustawienie białego tła dla stopki modala */
    border-top: 1px solid #eff2f7;
    border-bottom-right-radius: var(--bs-border-radius); /* Zaokrąglenie dolnych rogów */
    border-bottom-left-radius: var(--bs-border-radius);
}

/* Zwiększenie szerokości dużych okien modalnych */
@media (min-width: 992px) { /* Stosujemy tylko dla ekranów większych niż 992px */
    .modal-lg {
        max-width: 90%; /* Szerokość na 90% ekranu */
    }
}


/* 6. Poprawki dla Select2 */
.select2-container--bootstrap-5 .select2-selection {
    box-shadow: var(--bs-box-shadow-sm);
    border: 1px solid var(--bs-border-color);
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
    /* Przywrócenie domyślnego, niebieskiego podświetlenia dla Select2 */
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
}

/* 7. Profesjonalny wygląd tabel (kontener) */
.table-responsive {
    /* Usunięto tło z kontenera, aby było przezroczyste */
    box-shadow: none; /* Usunięcie cienia */
   /* border: 0px solid var(--bs-border-color);  Dodanie solidnego obramowania */
    border-radius: var(--bs-border-radius); /* Zachowujemy zaokrąglenie dla cienia i ewentualnego obramowania */
}

/* 8. Poprawki dla DataTables, aby były spójne z resztą stylu */
table.dataTable {
    border-collapse: separate !important; /* Utrzymanie naszych stylów */
    border-spacing: 0;
    background-color: #ffffff;
    border-radius: var(--bs-border-radius);
}

table.dataTable > thead > tr > th {
    background-color: transparent !important;
    border-width: 0 !important; /* Usunięcie obramowań nagłówka dla DataTables */
}

table.dataTable > thead > tr > th {
    border-bottom: 1px solid #dbd6d6 !important; /* Linia pod nagłówkiem */
    padding-bottom: 0.9rem;
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    /* Zmniejszenie pól (styl jak form-control-sm) */
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    padding: 0.25rem 0.5rem;
    margin-left: 0.5em;
    font-size: 0.875em;
}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    padding-top: 0.5em;
    padding-bottom: 0rem;
    
}

/* Styl dla przeniesionej kontrolki "Pokaż X pozycji" */
#datatable-length-placeholder .dataTables_length {
    display: inline-flex;
    align-items: center;
    margin-bottom: 0;
}

#datatable-length-placeholder .dataTables_length label {
    margin-bottom: 0;
    white-space: nowrap;
}

/* Styl dla naszego przeniesionego pola wyszukiwania */
#datatable-search-placeholder .form-control {
    width: 250px; /* Możesz dostosować szerokość */
    height: auto; /* Pozwalamy Bootstrapowi zarządzać wysokością */
}

/* Specjalny styl "focus" tylko dla pola wyszukiwania w tabeli */
#datatable-search-placeholder .form-control:focus {
    background-color: #fffead; /* Minimalnie ciemniejsze żółte tło */
    border-color: #ced4da;
    box-shadow: none;
}

/* Zmniejszenie czcionki dla informacji o rekordach w DataTables */
.dataTables_wrapper .dataTables_info {
  font-size: 0.85rem;
  padding-left: 0.5rem;
  padding-top: 1rem;
}

/* Styl "focus" dla selecta z ilością rekordów */
#datatable-length-placeholder .form-select:focus {
    border-color: #ced4da;
    box-shadow: none;
}

/* NOWA LOGIKA: Styl "focus" dla pól zmiany hasła w profilu użytkownika */
#current_password:focus,
#new_password:focus,
#confirm_password:focus {
    background-color: #fffead;
    box-shadow: none;
}

/* Stylizacja paginacji DataTables */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0.5rem 0.75rem;
    margin: 0 2px;
    border-radius: var(--bs-border-radius);
    border: 1px solid #dee2e6;
    background: #ffffff;
    color: var(--bs-primary) !important;
    box-shadow: none;
    font-size: 0.9rem; /* Zmniejszenie czcionki paginacji */
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #e9ecef;
    border-color: #dee2e6;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff !important;
}

/* Nadpisanie domyślnej dolnej ramki dla tabel bez stopki */
table.dataTable.no-footer {
    border-bottom: 1px solid #dbd6d6 !important;
}
.table > thead {
  background-color: #fbfbfb;
}rgb(245, 245, 245)

/* NOWA LOGIKA: Poprawki dla responsywnej tabeli DataTables */
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    background-color: var(--bs-primary); /* Zmiana koloru przycisku "+" na główny kolor aplikacji */
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before {
    background-color: #dc3545; /* Zmiana koloru przycisku "-" na czerwony */
}



/* 9. Delikatne pogrubienie dla znacznika <strong> */
strong {
    font-weight: 600; /* Standardowo jest to 700 (bold), 600 to "semibold" */
}

/* --- POPRAWKA: Integracja Select2 z Bootstrap Input Group --- */
/* Ta reguła sprawia, że kontener Select2 elastycznie rośnie, zostawiając miejsce dla przycisku */
.input-group .select2-container--bootstrap-5 {
    flex: 1 1 auto;
    width: 1% !important; /* Ważny trik, aby flexbox działał poprawnie */
}

/* --- POPRAWKA 2: Przyciemnienie tła dla drugiego modala (modal na modalu) --- */
.modal-backdrop + .modal-backdrop {
    z-index: 1056; /* Ustawia drugie tło NAD pierwszym modalem (który ma z-index 1055) */
}

/* --- KLUCZOWA POPRAWKA: Ustawienie drugiego modala na wierzchu --- */
/* Bootstrap domyślnie daje drugiemu modalowi z-index 1060, ale musimy to zagwarantować */
.modal + .modal {
    z-index: 1057; /* Ustawia drugi modal NAD jego własnym tłem (które ma z-index 1056) */
}

.yellow-form {
    background-color: #fffead;
}