/* =====================================================
   FILTRY
   ===================================================== */

.entitylist-filter-option-group-box-overflow {
    background-color: #2e2e2e;
    border-radius: 8px;
    padding: 10px;
}

.entitylist-filter-option-group-label {
    color: #cfcfcf;
    font-weight: 600;
    letter-spacing: 0.03em;
}

select,
.form-control select,
.entitylist-filter select {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
    color: #f1f1f1;
}

select:hover {
    border-color: #5c5c5c;
}

select:focus {
    border-color: #4dabf7;
    box-shadow: 0 0 0 2px rgba(77,171,247,0.25);
}

.input-group-text {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
}

.checkbox-column-container {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
}

.checkbox-column .checkbox label {
    color: #e0e0e0;
}

.checkbox-column .checkbox input[type="checkbox"] {
    background-color: #2b2b2b;
    border-color: #555;
}

.checkbox-column .checkbox input[type="checkbox"]:checked {
    background-color: #4dabf7;
    border-color: #4dabf7;
}

/* =====================================================
   ENTITY-GRID + SUBGRID
   ===================================================== */

.entity-grid.entitylist table,
.entity-grid.subgrid table {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
    color: #e6e6e6;
    border-collapse: collapse;
}

.entity-grid.entitylist thead th,
.entity-grid.subgrid thead th {
    background-color: #2b2b2b;
    color: #cfcfcf;
    border-bottom: 2px solid #3f3f3f;
    border-right: 1px solid #3a3a3a;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    padding: 10px;
}

.entity-grid.entitylist thead th a,
.entity-grid.subgrid thead th a {
    color: #cfcfcf;
    text-decoration: none;
}

/* Wyśrodkowanie pionowe rekordów */
.entity-grid.entitylist tbody td,
.entity-grid.subgrid tbody td {
    text-align: center;
    vertical-align: middle; /* 🔹 tutaj pionowe wyśrodkowanie */
    padding: 8px;
    border-top: 1px solid #2f2f2f;
    color: #e6e6e6;
}

/* =====================================================
   VIEW-GRID – PEŁNY STYL CIEMNY
   ===================================================== */

.view-grid table.table {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
    color: #e6e6e6;
    border-collapse: collapse;
}

.view-grid table.table > thead > tr > th {
    background-color: #2b2b2b !important;
    color: #cfcfcf !important;
    border-bottom: 2px solid #3f3f3f;
    border-right: 1px solid #3a3a3a;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    padding: 10px;
}

.view-grid table.table > thead > tr > th a {
    color: #cfcfcf;
    text-decoration: none;
}

.view-grid table.table > thead > tr > th:hover {
    background-color: #333333 !important;
}

.view-grid table.table > thead > tr > th[aria-sort="ascending"],
.view-grid table.table > thead > tr > th[aria-sort="descending"] {
    color: #4dabf7 !important;
}

.view-grid table.table > thead > tr > th[aria-sort="ascending"] a,
.view-grid table.table > thead > tr > th[aria-sort="descending"] a {
    color: #4dabf7 !important;
}

/* Wyśrodkowanie pionowe rekordów */
.view-grid table.table > tbody > tr > td {
    color: #e6e6e6;
    border-top: 1px solid #2f2f2f;
    text-align: center;
    vertical-align: middle;
    padding: 8px;
}

/* Wszystkie wiersze tabeli mają jednolite ciemne tło */
.view-grid table.table > tbody > tr {
    border-left: 6px solid #555;
    background-color: #1f1f1f !important;
    transition: background-color 0.25s ease;
}

/* Hover wiersza */
.view-grid table.table > tbody > tr:hover {
    background-color: #2a2a2a !important;
}

/* Nadpisanie Bootstrap striped rows (parzyste i nieparzyste) */
.view-grid table.table-striped > tbody > tr:nth-of-type(odd),
.view-grid table.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #1f1f1f !important;
}


.entitylist {
    border: none !important;
}
.entity-grid .dropdown-menu {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
}

.entity-grid .dropdown-menu .dropdown-item {
    color: #e0e0e0;
    background-color: #1f1f1f;
    border-bottom: 1px solid #2f2f2f;
}

.entity-grid .dropdown-menu .dropdown-item:hover {
    background-color: #2a2a2a;
    color: #ffffff;
}

.entity-grid .dropdown-menu .delete-link {
    color: #ff6b6b;
}

.entity-grid .dropdown-menu .delete-link:hover {
    background-color: rgba(255,107,107,0.15);
}
.clear-filters-btn {
    background-color: #5c1f1f;
    border: 1px solid #832020;
    color: #f1f1f1;
    border-radius: 6px;
    font-family: Arial;
    font-weight: 600;
    font-size: 14px;
    padding: 6px 20px;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.clear-filters-btn:hover {
    background-color: #832020;  
    border-color: #a02828;
}

.clear-filters-btn:active {
    background-color: #a02828;  
    border-color: #c03030;
}

.clear-filters-btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(208, 40, 40, 0.4);
}
/* =====================================================
   PRZYCISK DOWNLOAD
   ===================================================== */
.entitylist-download.btn.btn-info.float-end.action {
    background-color: #1f6fb2;   /* ciemny niebieski */
    color: #f1f1f1;              /* jasny tekst */
    border: 1px solid #145a86;   /* ciemniejsza obwódka */
    border-radius: 6px;
    transition: background-color 0.25s ease, border-color 0.25s ease;
}

.entitylist-download.btn.btn-info.float-end.action:hover {
    background-color: #145a86;
    border-color: #0f4562;
}

.entitylist-download.btn.btn-info.float-end.action:active {
    background-color: #0f4562;
    border-color: #0b344b;
}

.entitylist-download.btn.btn-info.float-end.action:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(31,111,178,0.4);
}

/* =====================================================
   PRZYCISK CREATE – JAŚNIEJSZY SZARY
   ===================================================== */
.btn.btn-primary.float-end.action.create-action {
    background-color: #6c6c6c;   /* jaśniejszy szary, kontrastujący z tłem */
    color: #f1f1f1;
    border: 1px solid #4d4d4d;
    border-radius: 6px;
    transition: background-color 0.25s ease, border-color 0.25s ease;
}

.btn.btn-primary.float-end.action.create-action:hover {
    background-color: #575757;
    border-color: #3f3f3f;
}

.btn.btn-primary.float-end.action.create-action:active {
    background-color: #444444;
    border-color: #2f2f2f;
}

.btn.btn-primary.float-end.action.create-action:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(150,150,150,0.4);
}

/* =====================================================
   VIEW-SEARCH – DARK MODE (WYGLĄD)
   ===================================================== */

.view-search.entitylist-search .query.form-control {
    background-color: #2e2e2e; /* ciemne tło inputa */
    color: #e6e6e6;            /* jasny tekst */
    border: 1px solid #3a3a3a; /* obwódka */
}

.view-search.entitylist-search .query.form-control::placeholder {
    color: #cfcfcf; /* kolor placeholdera */
}

.view-search.entitylist-search .input-group-btn button.btn {
    background-color: #1f1f1f; /* ciemny przycisk */
    color: #e6e6e6;            /* jasny tekst */
    border: 1px solid #3a3a3a; /* obwódka */
}

.view-search.entitylist-search .input-group-btn button.btn:hover {
    background-color: #333333;
    border-color: #4a4a4a;
}

.view-search.entitylist-search .input-group-btn button.btn:active {
    background-color: #444444;
    border-color: #555555;
}

.view-search.entitylist-search .input-group-btn button.btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(77,171,247,0.25);
}
/* =====================================================
   PRZYCISK BUTTON1 – CIEMNO-ZIELONY
   ===================================================== */
.btn.button1 {
    background-color: #1f4d2f;   /* ciemna zieleń */
    color: #f1f1f1;             /* jasny tekst */
    border: 1px solid #166336;   /* ciemniejsza obwódka */
    border-radius: 6px;
    margin: 6px 4px;             /* lekki odstęp od innych elementów */
    padding: 8px 16px;           /* delikatny padding */
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.25s ease, border-color 0.25s ease;
}

.btn.button1:hover {
    background-color: #166336;  
    border-color: #0f4628;
}

.btn.button1:active {
    background-color: #0f4628;  
    border-color: #0b3220;
}

.btn.button1:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(31,77,47,0.4); /* delikatny zielony glow */
}
/* =====================================================
   VIEW-SELECT – DARK MODE STYLING
   ===================================================== */

.view-select.nav.nav-pills {
    background-color: #1f1f1f;   /* ciemne tło */
    border: 1px solid #000000;   /* lekki czarny border */
    border-radius: 6px;
    padding: 4px 8px;
}

.view-select.nav.nav-pills .dropdown-toggle {
    color: #e6e6e6;              /* jasny tekst */
    background-color: transparent; 
    border: none;
}

.view-select.nav.nav-pills .dropdown-toggle:hover,
.view-select.nav.nav-pills .dropdown-toggle:focus {
    background-color: #2a2a2a;   /* ciemniejszy hover */
    color: #ffffff;
}

.view-select.nav.nav-pills .dropdown-menu {
    background-color: #1f1f1f;   /* tło dropdowna */
    border: 1px solid #000000;   /* czarny border */
    border-radius: 6px;
    min-width: 200px;            /* opcjonalnie, żeby dropdown nie był za wąski */
}

.view-select.nav.nav-pills .dropdown-item {
    color: #e6e6e6;              /* jasny tekst w menu */
    background-color: transparent;
    transition: background-color 0.2s ease;
}

.view-select.nav.nav-pills .dropdown-item:hover,
.view-select.nav.nav-pills .dropdown-item.active {
    background-color: #2a2a2a;   /* ciemniejszy hover / active */
    color: #ffffff;
}
/* =====================================================
   PAGINACJA – DARK MODE STYLING
   ===================================================== */

.jquery-bootstrap-pagination {
    display: flex;
    justify-content: center; /* wyśrodkowanie paginacji */
    margin-top: 12px;       /* lekki odstęp od tabeli/elementów powyżej */
}

.jquery-bootstrap-pagination .pagination {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    gap: 4px; /* odstęp między przyciskami */
}

.jquery-bootstrap-pagination .page-item .page-link {
    background-color: #1f1f1f;  /* ciemne tło */
    color: #e6e6e6;             /* jasny tekst */
    border: 1px solid #3a3a3a;  /* subtelny border */
    border-radius: 6px;
    padding: 6px 12px;
    cursor: pointer;
    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
    text-decoration: none;
}

.jquery-bootstrap-pagination .page-item .page-link:hover {
    background-color: #2a2a2a;  /* ciemniejszy hover */
    color: #ffffff;
    border-color: #4a4a4a;
}

.jquery-bootstrap-pagination .page-item.active .page-link {
    background-color: #4dabf7;  /* kolor aktywnej strony (niebieski jak Zastosuj) */
    color: #ffffff;
    border-color: #4dabf7;
}

.jquery-bootstrap-pagination .page-item.disabled .page-link {
    background-color: #1f1f1f;  /* ciemne tło */
    color: #555555;             /* szary tekst dla nieaktywnego */
    border-color: #2f2f2f;
    cursor: not-allowed;
}

/* strzałki poprzednia/następna */
.jquery-bootstrap-pagination .entity-pager-prev-link,
.jquery-bootstrap-pagination .entity-pager-next-link {
    font-weight: bold;
}
.crmEntityFormView {
    border: none !important
}
/* =====================================================
   FIELDSET – DARK MODE STYLING
   ===================================================== */

fieldset {
    background-color: #2e2e2e;  /* ciemne tło, takie jak panel filtrów */
    border: 1px solid #3a3a3a; /* subtelny border */
    border-radius: 8px;         /* zaokrąglone rogi */
    padding: 12px 16px;         /* przestrzeń wewnątrz fieldset */
    margin-bottom: 16px;        /* odstęp między fieldsetami */
    color: #e6e6e6;             /* jasny tekst */
}

/* =====================================================
   FIELDSET – WYŚRODKOWANIE LEGEND
   ===================================================== */

fieldset legend {
    display: block;          /* wymusza blok, żeby text-align działało */
    text-align: center;      /* wyśrodkowanie */
    color: #cfcfcf;          /* jasny tekst pasujący do fieldset */
    font-weight: 600;
    padding: 0 6px;          /* lekki padding dla czytelności */
}


/* Opcjonalnie: jeśli wewnątrz są inputy/selecty, można dopasować kolor */
fieldset input,
fieldset select,
fieldset textarea {
    background-color: #1f1f1f;
    border: 1px solid #3a3a3a;
    color: #e6e6e6;
    border-radius: 4px;
    padding: 6px 10px;
}
/* =====================================================
   FIELD-LABEL – DARK MODE – WYRAŹNE TŁO
   ===================================================== */

.field-label {
    display: inline-block !important;      /* wymusza block, żeby padding działał */
    background-color: #2e2e2e !important;  /* ciemne tło */
    color: #cfcfcf !important;             /* jasny tekst */
    font-weight: 500 !important;
    padding: 2px 6px !important;           /* lekki padding wokół tekstu */
    border-radius: 4px !important;         /* delikatne zaokrąglenie */
    margin-bottom: 4px !important;         /* odstęp od inputa */
}

/* =====================================================
   RADIO BUTTON – POWER PAGES DARK MODE – KOMPAKTOWE
   ===================================================== */

.boolean-radio {
    display: inline-flex;      /* wszystkie opcje w jednej linii */
    gap: 12px;                 /* odstęp między opcjami */
    align-items: center;
    flex-wrap: wrap;           /* jeśli brak miejsca, zawija */
}

/* =====================================================
   RADIO BUTTON – przywrócenie pierwotnego rozmiaru kulek
   ===================================================== */

.boolean-radio input[type="radio"] {
    appearance: none;          /* usuwa domyślny wygląd */
    -webkit-appearance: none;
    width: 18px;               /* stały rozmiar */
    height: 18px;
    min-width: 18px;           /* zabezpieczenie przed rozciąganiem */
    min-height: 18px;
    max-width: 18px;
    max-height: 18px;
    border: 2px solid #3a3a3a;
    border-radius: 50%;        /* okrągłe */
    background-color: #1f1f1f;
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;            /* nie rozciąga się */
    vertical-align: middle;    /* wyrównanie względem label */
    position: relative;
}

.boolean-radio input[type="radio"]:checked::after {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ffffff;
}

.boolean-radio input[type="radio"]:hover {
    border-color: #4dabf7;
}
/* =====================================================
   FIELDSET INPUT – RADIO – kompaktowe bez rozciągania
   ===================================================== */

fieldset .control input[type="radio"] {
    width: 18px;               /* stały rozmiar */
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    max-width: 18px;
    max-height: 18px;
    margin: 0;                 /* usuwa nadmiar paddingu/margin */
    padding: 0;                /* usuwa padding z fieldset */
    flex-shrink: 0;            /* nie rozciąga się */
    vertical-align: middle;    /* wyrównanie do labelki */
    position: relative;
}



/* Każdy input+label opakowany w span, wymuszenie inline-flex */
.boolean-radio input[type="radio"] + label {
    display: inline-flex;         /* label obejmuje tekst i padding */
    align-items: center;
    background-color: #2e2e2e;    /* ciemne tło label */
    color: #cfcfcf;
    font-weight: 500;
    padding: 2px 6px;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.25s ease, color 0.25s ease;
    vertical-align: middle;
}

.boolean-radio input[type="radio"] + label:hover {
    background-color: #333333;
    color: #ffffff;
}
/* =====================================================
   RADIO BUTTON – kropka wyśrodkowana
   ===================================================== */

.boolean-radio input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    max-width: 18px;
    max-height: 18px;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    position: relative;
    vertical-align: middle;
    border: 2px solid #3a3a3a;
    border-radius: 50%;
    background-color: #1f1f1f;
    cursor: pointer;
}

.boolean-radio input[type="radio"]:checked::after {
    content: '';
    position: absolute;
    top: 50%;               /* środek pionowy */
    left: 50%;              /* środek poziomy */
    transform: translate(-50%, -50%); /* dokładne wyśrodkowanie */
    width: 8px;             /* średnica kropki */
    height: 8px;
    border-radius: 50%;
    background-color: #ffffff;
}

.boolean-radio input[type="radio"]:hover {
    border-color: #4dabf7;
}
/* =====================================================
   FIELDSET – WEWNĘTRZNY PADDING DLA INPUTÓW/SELECT/TA
   ===================================================== */
fieldset .control {
    padding-left: 8px;   /* odstęp od lewej */
    padding-right: 8px;  /* odstęp od prawej */
}
.crmEntityFormView .form-control.readonly, .crmEntityFormView .form-control[readonly][disabled], .form-readonly .form-control
{
    padding-left: .375rem;
    padding-right: .375rem;
    padding-top: .375rem;
    padding-bottom: .375rem;
}
/* =====================================================
   PRZYCISK SUBMIT – CIEMNOZIELONY
   ===================================================== */
.submit-btn.btn.btn-primary.form-action-container-left {
    background-color: #2a4d2a;  /* ciemna zieleń */
    color: #e6e6e6;             /* jasny tekst */
    border: 1px solid #3a3a3a;  /* subtelny border pasujący do dark mode */
    border-radius: 6px;          /* lekko zaokrąglone rogi */
    padding: 6px 14px;           /* komfortowy padding */
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

/* Efekt hover */
.submit-btn.btn.btn-primary.form-action-container-left:hover {
    background-color: #3b6f3b;  /* jaśniejsza zieleń na hover */
    color: #ffffff;
}

/* Efekt aktywny/kliknięty */
.submit-btn.btn.btn-primary.form-action-container-left:active {
    background-color: #1f3a1f;
    border-color: #2e2e2e;
}
/* =====================================================
   SEKCJA AKCJI – DARK MODE BORDER
   ===================================================== */
.crmEntityFormView .actions {
    border-top: 1px solid #3a3a3a; /* ciemny, subtelny border */
    padding: 3px;
}
.entity-grid.entitylist table, .entity-grid.subgrid table
{
    border: none !important;

}
.crmEntityFormView, .entitylist, .modal-content, .popover-content
{
    border: none !important;
}
/* =====================================================
   BUTTON – PRIMARY
   ===================================================== */
.primary.btn.btn-primary {
    background-color: #4caf50;    /* ciemnozielone tło */
    color: #ffffff;               /* jasny tekst */
    border: 1px solid #388e3c;    /* ciemniejsza ramka */
    border-radius: 6px;
    padding: 6px 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.primary.btn.btn-primary:hover,
.primary.btn.btn-primary:focus {
    background-color: #66bb6a;    /* jaśniejszy zielony przy hover */
    color: #ffffff;
}

/* =====================================================
   BUTTON – CANCEL
   ===================================================== */
.cancel.btn.btn-default {
    background-color: #3a3a3a;    /* ciemnoszare tło */
    color: #cfcfcf;               /* jasny szary tekst */
    border: 1px solid #555555;    /* subtelna ramka */
    border-radius: 6px;
    padding: 6px 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.cancel.btn.btn-default:hover,
.cancel.btn.btn-default:focus {
    background-color: #505050;    /* jaśniejszy szary przy hover */
    color: #ffffff;
}

/* =====================================================
   BUTTON – REMOVE VALUE – spójny rozmiar
   ===================================================== */
.remove-value {
    display: inline-block;
    border-radius: 6px;
    padding: 6px 14px;       /* ten sam padding dla obu stanów */
    font-weight: 600;
    border: 1px solid #7f0000;
    line-height: 1.5;        /* zapewnia stabilną wysokość */
    box-sizing: border-box;  /* uwzględnia border w wymiarach */
    transition: background-color 0.25s ease, color 0.25s ease;
}

/* aktywny stan */
.remove-value:not([disabled]) {
    background-color: #b71c1c;
    color: #ffffff;
    cursor: pointer;
}

.remove-value:not([disabled]):hover,
.remove-value:not([disabled]):focus {
    background-color: #d32f2f;
}

/* disabled */
.remove-value[disabled] {
    background-color: #7f0000;
    color: #cccccc;
    cursor: not-allowed;
    opacity: 0.7;
    border: 1px solid #7f0000; /* ta sama grubość co aktywny */
}
/* =====================================================
   BOOTSTRAP DATETIMEPICKER – dopasowanie do dark mode
   ===================================================== */
.bootstrap-datetimepicker-widget tr td button {
    background-color: #3a3a3a;  /* tło zgodne z resztą strony */
    color: #e6e6e6;             /* jasny tekst */
    border: 1px solid #3a3a3a;  /* subtelny border dla kontrastu */
    border-radius: 4px;          /* lekko zaokrąglone rogi */
    padding: 4px 6px;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.bootstrap-datetimepicker-widget tr td button:hover,
.bootstrap-datetimepicker-widget tr td button:focus {
    background-color: #3a3a3a;  /* lekko jaśniejsze na hover/focus */
    color: #ffffff;
}
/* =====================================================
   LAUNCHEntityLookup & ClearLookupField – ciemny styl + border inputów
   ===================================================== */
.btn.launchentitylookup,
.btn.btn-default.launchentitylookup,
.btn.btn-default.clearlookupfield {
    background-color: #2e2e2e;      /* ciemne tło jak wyszukiwarka */
    color: #cfcfcf;                 /* jasna ikona/tekst */
    border: 1px solid #3a3a3a;      /* taki sam border jak inputy */
    border-radius: 4px;              /* lekko zaokrąglone rogi */
    padding: 6px 10px;               /* przycisk nie jest zbyt mały */
    font-weight: 600;                /* podobnie do innych przycisków */
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.1s ease;
}

/* hover */
.btn.launchentitylookup:hover,
.btn.btn-default.launchentitylookup:hover,
.btn.btn-default.clearlookupfield:hover {
    background-color: #333333;       /* delikatne podświetlenie */
    color: #ffffff;                  /* ikona/tekst jaśniejszy */
    text-decoration: none;           /* usuwa ewentualne podkreślenie */
}

/* aktywny / kliknięty */
.btn.launchentitylookup:active,
.btn.btn-default.launchentitylookup:active,
.btn.btn-default.clearlookupfield:active {
    background-color: #2a2a2a;       /* lekko ciemniejszy przy kliknięciu */
    transform: none;                 /* brak kurczenia się przycisku */
    color: #ffffff;
}

/* ikona wewnątrz przycisku */
.btn.launchentitylookup .fa-search,
.btn.btn-default.launchentitylookup .fa-search,
.btn.btn-default.clearlookupfield .fa-search {
    color: inherit;                  /* dziedziczy kolor z przycisku */
    font-size: 14px;                 /* dopasowanie do innych przycisków */
}
/* =====================================================
   DATETIMEPICKER – DARK GREEN THEME (FULL CONFIG)
   ===================================================== */

/* Wrapper */
.datetimepicker.input-group {
    display: flex;
    align-items: stretch;
    width: 100%;
}

/* Input */
.datetimepicker .form-control,
.datetimepicker .fake.form-control {
    background-color: #1f1f1f;
    color: #e6e6e6;
    border: 1px solid #3a3a3a;
    border-radius: 4px 0 0 4px;
    padding: 6px 10px;
    box-shadow: none;
}

.datetimepicker .form-control:focus {
    outline: none;
    border-color: #4caf50;
}

/* Icon addon */
.datetimepicker .input-group-addon {
    background-color: #2e2e2e;
    border: 1px solid #3a3a3a;
    border-left: none;
    border-radius: 0 4px 4px 0;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.datetimepicker .input-group-addon:hover {
    background-color: #333333;
}

.datetimepicker .icon-calendar {
    color: #a5d6a7;
    font-size: 14px;
}

/* Popup */
.bootstrap-datetimepicker-widget {
    background-color: #2e2e2e;
    border: 1px solid #3a3a3a;
    border-radius: 8px;
    padding: 8px;
    color: #e6e6e6;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
    z-index: 9999;
}

/* Headers */
.bootstrap-datetimepicker-widget table th {
    color: #cfcfcf;
    font-weight: 600;
}

/* Cells */
.bootstrap-datetimepicker-widget table td {
    color: #e6e6e6;
}

/* Day buttons */
.bootstrap-datetimepicker-widget table td button {
    background-color: transparent;
    border: none;
    color: #e6e6e6;
    border-radius: 4px;
    padding: 6px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Hover */
.bootstrap-datetimepicker-widget table td button:hover {
    background-color: #333333;
    color: #ffffff;
}

/* Active day */
.bootstrap-datetimepicker-widget table td.active button,
.bootstrap-datetimepicker-widget table td button.active {
    background-color: #4caf50;
    color: #ffffff;
    font-weight: 600;
}

/* Today */
.bootstrap-datetimepicker-widget table td.today button {
    border: 1px solid #4caf50;
}

/* Prev / Next */
.bootstrap-datetimepicker-widget table th.prev,
.bootstrap-datetimepicker-widget table th.next {
    color: #a5d6a7;
    cursor: pointer;
}

.bootstrap-datetimepicker-widget table th.prev:hover,
.bootstrap-datetimepicker-widget table th.next:hover {
    background-color: #333333;
}
 /* Clear Date Button – spójny z dropdownami */
.button-date-clear {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.375rem 0.75rem !important; /* zgodne z innymi przyciskami */
    font-size: 0.875rem !important;       /* rozmiar jak btn-sm */
    line-height: 1.5 !important;
    color: #495057 !important;            /* tekst ciemny */
    background-color: #fff !important;    /* biały, jak pola */
    border: 1px solid #ced4da !important;/* taki sam border jak inputy */
    border-radius: .375rem !important;
    cursor: pointer !important;
    transition: background-color 0.15s, border-color 0.15s !important;
    margin-left: 0.5rem !important;       /* oddzielony od pola daty */
}

.button-date-clear:hover {
    background-color: #e9ecef !important; /* delikatny hover */
    border-color: #adb5bd !important;     /* trochę ciemniejszy border */
}

.button-date-clear:focus {
    outline: none !important;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25) !important; /* podobnie jak focus input */
}
   .is-invalid {
    border: 2px solid red;
}
.custom-source-tooltip  {
    background-color: #1f1f1f !important;
    color: #ffffff !important;
    border: 1px solid #3a3a3a !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    box-shadow: 0 4px 14px rgba(0,0,0,0.45) !important;
    max-width: 220px; /* ograniczamy szerokość */
    word-wrap: break-word; /* łamanie długich słów */
    pointer-events: none;
}
.custom-source-tooltip * {
    color: #ffffff !important;
}
.custom-source-tooltip b {
    color: #ffd54f !important;
}

.custom-task-tooltip  {
    background-color: #1f1f1f !important;
    color: #ffffff !important;
    border: 1px solid #3a3a3a !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    box-shadow: 0 4px 14px rgba(0,0,0,0.45) !important;
    max-width: 220px; /* ograniczamy szerokość */
    word-wrap: break-word; /* łamanie długich słów */
    pointer-events: none;
}
.custom-task-tooltip * {
    color: #ffffff !important;
}
.custom-task-tooltip b {
    color: #ffd54f !important;
}
/* Kontener checkboxa */
#isReporterContainer {
    background-color: #2e2e2e;
    padding: 6px 10px;
    border-radius: 4px;
}

/* Label tekst */
#isReporterContainer .form-check-label {
    background-color: #2e2e2e;
    color: #ffffff;
}

/* Checkbox dopasowany do dark UI */
#isReporterContainer .form-check-input {
    background-color: #1f1f1f;
    border-color: #555;
}

#isReporterContainer .form-check-input:checked {
    background-color: #0d6efd; /* opcjonalnie kolor primary */
    border-color: #0d6efd;
}
  /* Styl dla listy linków */
.link-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 30px;
    align-items: center; /* Wyśrodkowanie poziome */
    justify-content: center; /* Wyśrodkowanie pionowe */
    margin: 0 auto; /* Wyśrodkowanie kontenera */
    max-width: 300px; /* Maksymalna szerokość kontenera */
  }
  
  /* Styl dla linków */
  .list-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    height: 50px;
    text-decoration: none;
    color: black;
    background-color: white;
    border: 2px solid black;
    border-radius: 10px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s, transform 0.2s, box-shadow 0.3s;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  }
  
  /* Efekt hover na linkach */
  .list-link:hover {
    background-color: #7abd31;
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
  }
  
  /* Przycisk "Powrót" */
  .back-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-top: 30px;
      width: 90px; /* Węższy przycisk */
      height: 45px;
      background-color: #f4f4f4; /* Delikatny szary kolor */
      color: #333; /* Ciemny kolor tekstu */
      border: 2px solid #aaa; /* Subtelna, cienka ramka */
      border-radius: 10px;
      font-weight: bold;
      font-size: 15px; /* Większa strzałka */
      text-decoration: none; /* Usunięcie podkreślenia */
      cursor: pointer;
      transition: background-color 0.3s, color 0.3s, transform 0.2s, box-shadow 0.3s;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtelny cień */
    }
    
    .back-button:hover {
      background-color: #e1e1e1; /* Jaśniejszy szary po najechaniu */
      color: #333; /* Zachowaj ciemny kolor tekstu */
      transform: translateY(-2px); /* Podniesienie przycisku */
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15); /* Subtelny cień */
    }

    #taskActionButtonsHeader .btn.btn-primary{
    height:34px;
    padding:6px 14px;
    font-size:14px;
    font-weight:500;
    border-radius:6px;
    border:none !important;
    background-color:#1976d2;
    color:#fff;
    transition:all .2s ease;
}

#taskActionButtonsHeader .btn.btn-primary:hover{
    background-color:#1565c0;
}
.table-info {
    --bs-table-color: #e6e6e6 !important;
    --bs-table-bg: #1e3a40 !important;
    --bs-table-border-color: #2a4f56 !important;
    --bs-table-striped-bg: #22454b !important;
    --bs-table-striped-color: #e6e6e6 !important;
    --bs-table-active-bg: #2a5a62 !important;
    --bs-table-active-color: #ffffff !important;
    --bs-table-hover-bg: #255158 !important;
    --bs-table-hover-color: #ffffff !important;

    color: var(--bs-table-color) !important;
    border-color: var(--bs-table-border-color) !important;
}

.szr-test-environment-banner {
    position: sticky;
    top: 0;
    z-index: 10000;
    width: 100%;
    padding: 8px 16px;
    border-bottom: 2px solid #185c00;
    background: #7abd31;
    color: #102700;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0.06em;
    text-align: center;
}

@media (max-width: 576px) {
    .szr-test-environment-banner {
        padding: 7px 10px;
        font-size: 12px;
        letter-spacing: 0.03em;
    }
}