a {
        text-decoration: none;
    }

    @media print {
        body {
            font-family: 'Open Sans', sans-serif;
            background-color: #fff !important;
            color: #000;
            margin: 0;
            padding: 0;
        }
        .container-fluid {
            padding: 0.5em;
        }
        .no-print {
            display: none !important;
        }
        .card {
            box-shadow: none !important;
            border: none !important;
            page-break-inside: avoid;
        }
        .qr-print-item {
            page-break-inside: avoid;
            width: 25%;
            float: left;
        }
    }

    body {
        font-family: 'Roboto', sans-serif;
        font-size: 14px;
    }

    h2 {
        font-family: 'Poppins', sans-serif;
        font-weight: 600;
    }

    .status-ok { color: #28a745; font-weight: bold; }
    .status-uwaga { color: #ffc107; font-weight: bold; }
    .status-pilne { color: #dc3545; font-weight: bold; }

    .table td.status-col {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 150px;
    }

    .uwagi-col {
        max-width: 250px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .summary-box-container {
        background-color: #edece7;
        border-radius: 8px;
        padding: 1.5rem;
    }

    /* Nowe style dla responsywnego sidebara */
    #wrapper {
        display: flex;
    }

    #sidebar-wrapper {
        min-height: 100vh;
        margin-left: -15rem;
        transition: margin .25s ease-out;
    }

    #sidebar-wrapper .sidebar-heading {
        padding: 0.875rem 1.25rem;
        font-size: 1.2rem;
    }

    #sidebar-wrapper .list-group {
        width: 15rem;
    }

    #page-content-wrapper {
        min-width: 100vw;
    }

    #wrapper.toggled #sidebar-wrapper {
        margin-left: 0;
    }

    @media (min-width: 992px) {
        #sidebar-wrapper {
            margin-left: 0;
        }
        #page-content-wrapper {
            min-width: 0;
            width: 100%;
        }
        #wrapper.toggled #sidebar-wrapper {
            margin-left: -15rem;
        }
    }

    /* === Nowy schemat kolorów (Opcja A: Jasny Szary, v3) === */
    .sidebar-bg {
        background-color: #f2f3f9;
        border-right: none !important; /* Usunięcie prawej ramki */
    }

    #sidebar-wrapper .sidebar-heading {
        color: #074f8e !important; /* Stały kolor dla nagłówka */
    }

    .sidebar-link {
        color: #343a40 !important; /* Ciemny tekst dla czytelności */
        border: none;
    }

    .sidebar-link .fas {
        color: #6c757d !important; /* Szare ikony */
    }

    .sidebar-link.list-group-item {
        background-color: transparent;
        border-radius: 0;
    }

    .sidebar-link:hover {
        background-color: #e9ecef;
        color: #000 !important;
    }

    .sidebar-link:hover .fas {
        color: #000 !important;
    }

    .sidebar-link.active {
        background-color: #0d6efd;
        color: #fff !important;
    }

    /* Wspólne style dla aktywnego i najechanego linku */
    .sidebar-link:hover,
    .sidebar-link.active {
        border-top-right-radius: 25px;
        border-bottom-right-radius: 25px;
        margin-right: -1px;
        padding-right: calc(1.25rem + 1px);
    }

    .sidebar-link.active .fas {
        color: #fff !important;
    }

    #page-content-wrapper .navbar {
        background-color: #f2f3f9;
        border-bottom: none; /* Usunięcie dolnej ramki */
    }

    #page-content-wrapper .navbar h2 {
        color: #788089;
    }

    #page-content-wrapper {
        background-color: #f2f3f9; /* Tło strony takie samo jak menu */
    }

    #page-content-wrapper .card {
        border: none; /* Usunięcie obramowania z kart treści */
        border-radius: 15px;
    }
    /* === Koniec nowego schematu === */

    .table .dropdown-menu {
    position: absolute;
    z-index: 1050;
    }

    /* Dark Mode Styles */
    [data-bs-theme="dark"] {
        --bs-body-bg: #212529;
        --bs-body-color: #dee2e6;
        --bs-card-bg: #343a40;
        --bs-card-color: #dee2e6;
        --bs-border-color: #495057;
        --bs-primary: #0d6efd; /* Default Bootstrap primary */
        --bs-danger: #dc3545; /* Default Bootstrap danger */
        --bs-warning: #ffc107; /* Default Bootstrap warning */
        --bs-success: #198754; /* Default Bootstrap success */

        /* Ensure body background and color are overridden */
        background-color: var(--bs-body-bg) !important;
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme="dark"] .card {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .card.bg-primary {
        background-color: #3975b4 !important; /* Darker blue */
    }

    [data-bs-theme="dark"] .card.bg-danger {
        background-color: #a9313d !important; /* Darker red */
    }

    [data-bs-theme="dark"] .card.bg-warning {
        background-color: #d1a931 !important; /* Darker yellow */
    }

    [data-bs-theme="dark"] .card.bg-success {
        background-color: #367946 !important; /* Darker green */
    }

    [data-bs-theme="dark"] .table {
        color: var(--bs-body-color);
    }

    [data-bs-theme="dark"] .table thead {
        background-color: #495057;
    }

    [data-bs-theme="dark"] .table thead th a {
        color: var(--bs-body-color);
    }

    [data-bs-theme="dark"] .table tbody tr:nth-of-type(odd) {
        background-color: #2c3034;
    }

    [data-bs-theme="dark"] .table tbody tr:hover {
        background-color: #495057;
    }

    [data-bs-theme="dark"] .form-control {
        background-color: #343a40;
        color: var(--bs-body-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .form-control::placeholder {
        color: #adb5bd;
    }

    [data-bs-theme="dark"] .form-select {
        background-color: #343a40;
        color: var(--bs-body-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .btn-primary {
        background-color: var(--bs-primary);
        border-color: var(--bs-primary);
    }

    [data-bs-theme="dark"] .btn-danger {
        background-color: var(--bs-danger);
        border-color: var(--bs-danger);
    }

    [data-bs-theme="dark"] .btn-secondary {
        background-color: #6c757d;
        border-color: #6c757d;
    }

    [data-bs-theme="dark"] .sidebar-bg {
        background-color: #212529 !important; /* Darker sidebar background */
    }

    [data-bs-theme="dark"] .sidebar-link {
        color: #dee2e6 !important; /* Jaśniejszy tekst dla lepszego kontrastu */
        background-color: transparent !important;
    }

    [data-bs-theme="dark"] .sidebar-link:hover, [data-bs-theme="dark"] .sidebar-link.active {
        background-color: rgba(255, 255, 255, 0.1) !important;
        color: #fff !important;
    }

    [data-bs-theme="dark"] .pagination .page-link {
        background-color: #343a40;
        color: var(--bs-body-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .pagination .page-item.active .page-link {
        background-color: var(--bs-primary);
        border-color: var(--bs-primary);
        color: #fff;
    }

    [data-bs-theme="dark"] .pagination .page-link:hover {
        background-color: #495057;
        border-color: #6c757d;
    }

    [data-bs-theme="dark"] #page-content-wrapper {
        background-color: var(--bs-body-bg) !important;
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme="dark"] #page-content-wrapper .navbar {
        background-color: var(--bs-body-bg) !important;
        border-color: var(--bs-border-color) !important;
    }

    /* Dark Mode Styles for Modals */
    [data-bs-theme="dark"] .modal-content {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .modal-header {
        background-color: var(--bs-card-bg);
        border-bottom-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .modal-title {
        color: var(--bs-card-color);
    }

    [data-bs-theme="dark"] .modal-body {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color);
    }

    [data-bs-theme="dark"] .modal-body h5 {
        color: var(--bs-card-color);
    }

    [data-bs-theme="dark"] .modal-footer {
        background-color: var(--bs-card-bg);
        border-top-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .btn-close {
        filter: invert(1) grayscale(100%) brightness(200%); /* Make close button visible on dark background */
    }

    /* Dark Mode Styles for List Group inside Modals and Changelog */
    [data-bs-theme="dark"] .list-group-item {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .pipeline-content {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color); /* Ensure text is readable */
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .pipeline-content::before {
        border-right-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .pipeline-content::after {
        border-right-color: var(--bs-card-bg);
    }

    [data-bs-theme="dark"] .pipeline-date,
    [data-bs-theme="dark"] .pipeline-author {
        color: var(--bs-body-color); /* Adjust date/author color for dark mode */
    }



    [data-bs-theme="dark"] .table tbody tr {
        color: var(--bs-body-color) !important; /* Ensure all table body text is light */
    }

    [data-bs-theme="dark"] .table tbody td {
        color: var(--bs-body-color) !important; /* Ensure all table body cell text is light */
        border-bottom: none;
    }

    [data-bs-theme="dark"] .table tbody td a {
        color: var(--bs-body-color) !important;
    }

    /* Dark Mode Styles for Dropdown Menus */
    [data-bs-theme="dark"] .dropdown-menu {
        background-color: var(--bs-card-bg);
        color: var(--bs-card-color) !important;
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .dropdown-item {
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme="dark"] .dropdown-item:hover,
    [data-bs-theme="dark"] .dropdown-item:focus {
        background-color: rgba(255, 255, 255, 0.1);
        color: #fff !important;
    }

    /* Ensure no text decoration for links in tables and column headers */
    .table a, .table th a {
        text-decoration: none !important;
    }

    /* Dark Mode Styles for Links in Summary Boxes */
    .row.mb-4 a.text-decoration-none {
        color: var(--bs-body-color) !important;
    }

    .hamburger-icon-only {
        background-color: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
    }

    .hamburger-icon-only:hover,
    .hamburger-icon-only:focus,
    .hamburger-icon-only:active {
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    .hamburger-icon-only i {
        color: #343a40; /* Adjust color for visibility against light background */
    }

    [data-bs-theme="dark"] .hamburger-icon-only i {
        color: #dee2e6; /* Adjust color for visibility against dark background */
    }

    .alert .alert-heading,
    .alert .fs-2 {
        font-family: 'Poppins', sans-serif;
    }

    @media (max-width: 767.98px) { /* Bootstrap's 'md' breakpoint minus 0.02px */
        .alert .alert-heading {
            font-size: 0.625rem !important; /* Half of 1.25rem (h5) */
        }
        .alert .fs-2 {
            font-size: 0.75rem !important; /* Half of 1.5rem (fs-2) */
        }
    }

    .alert-danger-custom {
        background-color: #cc1a2b;
        color: #fff;
        border-color: #b81726;
    }

    .alert-danger-custom .alert-heading,
    .alert-danger-custom .fs-2,
    .alert-danger-custom a {
        color: #fff !important;
    }

    .box-info {
        background-color: #edece7; /*d9d8e9*/
        border: none;
    }

    .box-info h5, .box-info p {
        color: #343a40;
    }

    /* Gradient Box Styles */
    .box-gradient-1, .box-gradient-2, .box-gradient-3, .box-gradient-4, .box-gradient-5, .box-gradient-6 {
        color: #fff;
        border: none;
    }
    .box-gradient-1 h5, .box-gradient-1 p,
    .box-gradient-2 h5, .box-gradient-2 p,
    .box-gradient-3 h5, .box-gradient-3 p,
    .box-gradient-4 h5, .box-gradient-4 p,
    .box-gradient-5 h5, .box-gradient-5 p,
    .box-gradient-6 h5, .box-gradient-6 p {
        color: #fff;
    }

    .box-gradient-1 {
        background: linear-gradient(135deg, #003049, #1a535c); /* Deep blue to teal */
    }

    .box-gradient-2 {
        background: linear-gradient(135deg, #D62828, #9d1a1a); /* Strong red to dark red */
    }

    .box-gradient-3 {
        background: linear-gradient(135deg, #F77F00, #c46500); /* Vibrant orange to darker orange */
    }

    .box-gradient-4 {
        background: linear-gradient(135deg, #FCBF49, #e0a800); /* Warm yellow to golden yellow */
    }

    .box-gradient-5 {
        background: linear-gradient(135deg, #8AB62E, #6a931e); /* Fresh green to darker green */
    }

    .box-gradient-6 {
        background: linear-gradient(135deg, #6c757d, #495057); /* Gray gradient */
    }

    [data-bs-theme="dark"] .summary-box-container {
        background-color: #343a40;
    }

    [data-bs-theme="dark"] .box-info {
        background-color: transparent;
    }

    [data-bs-theme="dark"] .box-info h5, 
    [data-bs-theme="dark"] .box-info p {
        color: #dee2e6;
    }

    /* Style dla obrazka/ikony w karcie (Responsywne) */
    .sprzet-image-container {
        width: 60px; /* Domyślny (mobilny) rozmiar */
        height: 60px;
        margin: auto 0.75rem auto 0.5rem;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #f0f0f0;
        border-radius: 8px; /* Zaokrąglony kwadrat */
        flex-shrink: 0;
        overflow: hidden;
    }

    .sprzet-image-container img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .sprzet-image-container .placeholder-icon {
        font-size: 28px; /* Dopasowany do mniejszego rozmiaru */
        color: #adb5bd;
    }

    /* Style dla większych ekranów (desktop) */
    @media (min-width: 768px) {
        .sprzet-image-container {
            width: 100px;
            height: 100px;
        }
        .sprzet-image-container .placeholder-icon {
            font-size: 48px; /* Dopasowany do większego rozmiaru */
        }
    }

    [data-bs-theme="dark"] .sprzet-image-container {
        background-color: #495057;
    }

    [data-bs-theme="dark"] .sprzet-image-container .placeholder-icon {
        color: #6c757d;
    }

    /* Nowe style dla kart sprzętu */
    .sprzet-card {
        background-color: #fff;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.08);
        overflow: hidden; /* To keep the border radius on the status border */
        border: 1px solid #e9ecef;
    }

    [data-bs-theme="dark"] .sprzet-card {
        background-color: var(--bs-card-bg);
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .sprzet-sn,
    [data-bs-theme="dark"] .btn-show-more {
        color: #adb5bd;
    }

    .status-border {
        width: 6px;
    }

    .status-border-awaria, .status-border-nok {
        background-color: #dc3545; /* Czerwony */
    }

    .status-border-uwaga {
        background-color: #ffc107; /* Żółty */
    }

    .status-border-ok {
        background-color: #198754; /* Zielony */
    }

    .status-border-secondary {
        background-color: #6c757d; /* Szary */
    }

    .card-main-content { padding: 1rem; }
    .card-header-section { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.75rem; }
    .sprzet-nazwa { font-weight: 600; margin-bottom: 0; }
    .sprzet-nazwa-link { color: inherit; text-decoration: none; }
    .sprzet-nazwa-link:hover { text-decoration: underline; }
    .sprzet-sn { font-size: 0.85rem; color: #6c757d; }
    .card-details-section { display: flex; gap: 1.5rem; align-items: center; margin-bottom: 0.75rem; }
    .status-badge-container { margin-right: auto; }
    .card-footer-section { text-align: center; padding-top: 0.5rem; }
    .btn-show-more { font-size: 0.8rem; color: #6c757d; text-decoration: none; }
    .btn-show-more .fas { transition: transform 0.3s ease; }
    .btn-show-more[aria-expanded="true"] .fas { transform: rotate(180deg); }
    .card-expanded-details { padding-top: 0.5rem; }

    /* 5. Progress Circle & History Pipeline */
    .progress-circle {
        width: 45px;
        height: 45px;
        border-radius: 50%;
        display: grid;
        place-items: center;
        background: conic-gradient(var(--progress-color, #198754) var(--progress-value), #e9ecef 0);
        font-size: 0.8rem;
        font-weight: 600;
        position: relative;
    }

    .progress-circle::before {
        content: '';
        position: absolute;
        width: 75%;
        height: 75%;
        background: #fff;
        border-radius: 50%;
    }

    .progress-circle .progress-value { position: relative; z-index: 1; }
    .progress-circle.progress-ok { --progress-color: #198754; }
    .progress-circle.progress-uwaga { --progress-color: #ffc107; }
    .progress-circle.progress-nok { --progress-color: #dc3545; }

    .history-pipeline {
        position: relative;
        padding-left: 25px;
    }

    .history-pipeline::before {
        content: '';
        position: absolute;
        left: 10px;
        top: 10px;
        bottom: 10px;
        width: 2px;
        background-color: #e9ecef;
    }

    .pipeline-item {
        position: relative;
        margin-bottom: 1.5rem;
    }

    .pipeline-item:last-child {
        margin-bottom: 0;
    }

    .pipeline-dot {
        position: absolute;
        left: 0px;
        top: 5px;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background-color: #0d6efd;
        border: 3px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
    }

    .pipeline-dot .fas {
        font-size: 10px;
        color: #fff;
    }

    .pipeline-content {
        position: relative;
        margin-left: 30px;
        background-color: #f8f9fa;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 0.75rem 1rem;
    }

    .pipeline-content::before {
        content: " ";
        height: 0;
        position: absolute;
        top: 8px;
        width: 0;
        z-index: 1;
        left: -11px;
        border: 5px solid transparent;
        border-right-color: #e9ecef;
    }

    .pipeline-content::after {
        content: " ";
        height: 0;
        position: absolute;
        top: 8px;
        width: 0;
        z-index: 2;
        left: -10px;
        border: 5px solid transparent;
        border-right-color: #f8f9fa;
    }

    .pipeline-date {
        font-weight: 600;
        font-size: 0.8rem;
        color: #6c757d;
        margin-bottom: 0.25rem;
    }

    .pipeline-text {
        font-size: 0.9rem;
    }

    .pipeline-author {
        font-size: 0.8rem;
        margin-top: 0.5rem;
        color: #6c757d;
    }

    /* 6. Other Elements (Modals, Pagination, etc.) */
    [data-bs-theme="dark"] .modal-content, [data-bs-theme="dark"] .modal-header, [data-bs-theme="dark"] .modal-body, [data-bs-theme="dark"] .modal-footer {
        background-color: var(--bs-card-bg);
        color: var(--text-main);
        border-color: var(--border-color);
    }

    [data-bs-theme="dark"] .list-group-item {
        background-color: var(--bs-card-bg);
        color: var(--text-main);
        border-color: var(--border-color);
    }

    .box-info { background-color: var(--bg-main); border: none; }
    .box-info h5, .box-info p { color: var(--text-main); }

    .box-gradient-1, .box-gradient-2, .box-gradient-3, .box-gradient-4, .box-gradient-5 {
        color: #fff; border: none; 
    }
    .box-gradient-1 h5, .box-gradient-1 p, .box-gradient-2 h5, .box-gradient-2 p, .box-gradient-3 h5, .box-gradient-3 p, .box-gradient-4 h5, .box-gradient-4 p, .box-gradient-5 h5, .box-gradient-5 p {
        color: #fff;
    }

    .btn-close { filter: invert(0) sepia(1) saturate(2000) hue-rotate(320deg) ; }
    [data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

    .details-table {
        /* Styl usunięty na prośbę użytkownika */
    }

    .details-row {
        display: flex;
        justify-content: space-between;
        padding: 0.75rem;
        border-bottom: 1px solid #e9ecef;
    }

    .details-row:last-child {
        border-bottom: none;
    }

    .details-label {
        color: #6c757d;
    }

    .details-value {
        font-weight: 500;
    }

    /* Custom styles for sprzet_detale.php status line */
    .sprzet-detale-status-line .fas {
        font-size: 1.1em; /* Slightly larger icon */
    }

    .sprzet-detale-status-line .badge {
        font-size: 0.95em; /* Slightly larger text in badge */
        padding: 0.4em 0.7em; /* Increase padding for a larger badge */
    }


    /* Custom styles for sprzet_detale.php status line */
    .sprzet-detale-status-line .fas {
        font-size: 1.1em; /* Slightly larger icon */
    }

    .sprzet-detale-status-line .badge {
        font-size: 0.95em; /* Slightly larger text in badge */
        padding: 0.4em 0.7em; /* Increase padding for a larger badge */
    }



    [data-bs-theme="dark"] .details-row {
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .details-label {
        color: var(--bs-text-muted);
    }

    [data-bs-theme="dark"] .details-value {
        color: var(--bs-text-main);
    }

    [data-bs-theme="dark"] .progress-circle {
        background: conic-gradient(var(--progress-color, #198754) var(--progress-value), #495057 0);
    }

    [data-bs-theme="dark"] .progress-circle::before {
        background: var(--bs-card-bg);
    }

    [data-bs-theme="dark"] .progress-circle .progress-value {
        color: #dee2e6;
    }

    /* Drag and Drop Upload Area */
    #drag-drop-zone {
        border: 2px dashed #0d6efd;
        border-radius: 8px;
        padding: 2rem;
        text-align: center;
        cursor: pointer;
        background-color: #f8f9fa;
        transition: background-color 0.2s ease-in-out;
    }

    #drag-drop-zone.drag-over {
        background-color: #e9ecef;
        border-style: solid;
    }

    #drag-drop-zone p {
        margin: 0;
        font-weight: 500;
    }

    #drag-drop-zone .fas {
        color: #0d6efd;
        margin-top: 0.5rem;
    }

    [data-bs-theme="dark"] #drag-drop-zone {
        background-color: #343a40;
        border-color: #0d6efd;
    }

    [data-bs-theme="dark"] #drag-drop-zone.drag-over {
        background-color: #495057;
    }

    #file-list .file-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.25rem 0.5rem;
        background-color: #e9ecef;
        border-radius: 4px;
        margin-top: 0.25rem;
    }

    [data-bs-theme="dark"] #file-list .file-item {
        background-color: #495057;
    }

    /* Existing Images Gallery in Modal */
    #istniejace-zdjecia-kontener .img-thumbnail {
        width: 100%;
        height: 100px;
        object-fit: cover;
    }

    #istniejace-zdjecia-kontener .usun-zdjecie-btn {
        padding: 0.1rem 0.4rem;
        font-size: 0.7rem;
        line-height: 1.2;
    }

    /* Mobile Responsiveness Fixes */
    @media (max-width: 576px) {
        .card-header-section {
            flex-direction: column;
            align-items: flex-start;
            gap: 0.75rem; /* Add space between title and buttons */
        }

        .card-details-section {
            flex-direction: column;
            align-items: flex-start; /* Align items to the left */
            gap: 1rem; /* Add space between stacked items */
        }

        .status-badge-container {
            margin-right: 0; /* Remove the auto margin */
        }
    }

    .table-thumbnail {
        width: 45px;
        height: 45px;
        object-fit: cover;
        border-radius: 5px;
    }

    .table-thumbnail-placeholder {
        font-size: 24px;
        color: #adb5bd;
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    [data-bs-theme="dark"] .table-thumbnail-placeholder {
        color: #6c757d;
    }

    /* Dark Mode for Offcanvas */
    [data-bs-theme="dark"] .offcanvas {
        background-color: var(--bs-card-bg, #212529);
        color: var(--bs-body-color, #dee2e6);
    }

    [data-bs-theme="dark"] .offcanvas-header {
        border-bottom: 1px solid var(--bs-border-color, #495057);
    }

    [data-bs-theme="dark"] .list-group-item {
        background-color: transparent;
        border-color: rgba(255, 255, 255, 0.125);
    }

    /* Refined Sidebar Menu Styles */
    #sidebar-wrapper .list-group {
        display: flex;
        flex-direction: column;
        height: calc(100vh - 80px); /* Adjust based on header height */
        padding: 0 0.75rem;
    }

    #sidebar-wrapper .sidebar-link {
        font-weight: 500;
        padding: 0.65rem 1rem;
        border-radius: 0.375rem;
        margin-bottom: 0.25rem;
        border-left: 3px solid transparent;
        transition: background-color 0.2s ease, color 0.2s ease, padding-left 0.2s ease-in-out;
    }

    #sidebar-wrapper .sidebar-link:hover {
        background-color: #e9ecef;
        border-left-color: #d1d5db;
    }

    #sidebar-wrapper .sidebar-link.active {
        background-color: #e7f0fe;
        color: #0d6efd !important;
        font-weight: 600;
        border-left-color: #0d6efd;
    }

    #sidebar-wrapper .sidebar-link.active .fas {
        color: #0d6efd !important;
    }

    .sidebar-section {
        margin-bottom: 0.5rem;
    }

    .sidebar-section-title {
        padding: 1rem 0.75rem 0.5rem;
        color: #8a92a6;
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .sidebar-section-title-toggle {
        padding: 0.65rem 1rem;
        color: #8a92a6;
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        display: block;
        text-decoration: none;
        cursor: pointer;
        border-radius: 0.375rem;
        transition: background-color 0.2s ease, color 0.2s ease;
    }

    .sidebar-section-title-toggle:hover {
        background-color: #e9ecef;
        color: #343a40;
    }

    .sidebar-section-title-toggle .fa-chevron-down {
        font-size: 0.7rem;
        transition: transform 0.2s ease-in-out;
    }

    .sidebar-section-title-toggle[aria-expanded="true"] .fa-chevron-down {
        transform: rotate(180deg);
    }

    #sidebar-wrapper .collapse .sidebar-link {
        padding-left: 2.75rem; /* Indent sub-items */
    }

    /* Dark Mode Refined Styles */
    [data-bs-theme="dark"] .sidebar-section-title,
    [data-bs-theme="dark"] .sidebar-section-title-toggle {
        color: #8a92a6;
    }

    [data-bs-theme="dark"] .sidebar-section-title-toggle:hover {
        background-color: #343a40;
        color: #fff;
    }

    [data-bs-theme="dark"] #sidebar-wrapper .sidebar-link:hover {
        background-color: #343a40;
        border-left-color: #495057;
    }

    [data-bs-theme="dark"] #sidebar-wrapper .sidebar-link.active {
        background-color: #2a3038;
        color: #529aff !important;
        border-left-color: #529aff;
    }

    [data-bs-theme="dark"] #sidebar-wrapper .sidebar-link.active .fas {
        color: #529aff !important;
    }

    /* Override original sidebar styles that are no longer needed */
    .sidebar-link:hover,
    .sidebar-link.active {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        margin-right: 0;
        padding-right: 1rem;
    }

    [data-bs-theme="dark"] .sidebar-link:hover, [data-bs-theme="dark"] .sidebar-link.active {
        background-color: transparent !important;
    }

    .box-icon {
        position: absolute;
        bottom: 10px;
        right: 10px;
        font-size: 3em; /* Adjust size as needed */
        opacity: 0.2; /* Make it subtle */
        color: inherit; /* Inherit color from parent for shading */
    }

    .img-archived {
        filter: grayscale(100%);
        opacity: 0.6;
    }

    @media (min-width: 768px) {
        .sprzet-card .status-badge-container .badge {
            font-size: 0.9rem;
            padding: 0.5em 0.7em;
        }
    }

    /* New Login Page Styles */
    body#login-page {
        overflow: hidden; /* Prevent scrollbars from the canvas */
    }

    .login-container-wrapper {
        height: 100vh;
        width: 100vw;
    }

    .login-form-panel {
        background-color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 2rem 3rem;
        box-shadow: 5px 0px 25px rgba(0, 0, 0, 0.07);
        z-index: 10;
    }

    .login-bg-panel {
        background-color: #f8f9fa; /* Light background */
        position: relative;
        overflow: hidden;
        background-image: url('/zdjecie.png');
        background-size: cover;
        background-position: center center;
    }




    /* Ensure form inputs are aligned */
    .input-group .form-floating {
        flex: 1 1 auto;
    }

    @media (max-width: 767.98px) {
        .login-bg-panel {
            display: none; /* Hide background panel on mobile */
        }
        .login-form-panel {
            padding: 2rem 1.5rem;
        }
    }

    /* --- Animated Wave Header for Offcanvas (Inverted) --- */
    .offcanvas-profile-header {
    position: relative;
    padding: 5rem 1rem 2rem 1rem;
    margin: -1rem -1rem 1rem -1rem;
    }

    .offcanvas-profile-header .text-center {
    position: relative;
    z-index: 2;
    }

    .offcanvas-profile-header .text-center img.rounded-circle {
    border: 3px solid var(--bs-border-color-translucent);
    }

    .waves-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    overflow: hidden;
    z-index: 1;
    transform: rotate(180deg);
    }

    .waves-container .waves {
    position: relative;
    width: 100%;
    height: 15vh;
    margin-bottom: -7px;
    min-height: 100px;
    max-height: 150px;
    }

    .waves-container .parallax > use {
    animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
    }

    [data-bs-theme="light"] .waves-container .parallax > use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; fill: rgba(0, 0, 0, 0.08); }
    [data-bs-theme="light"] .waves-container .parallax > use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; fill: rgba(0, 0, 0, 0.05); }
    [data-bs-theme="light"] .waves-container .parallax > use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; fill: rgba(0, 0, 0, 0.03); }
    [data-bs-theme="light"] .waves-container .parallax > use:nth-child(4) { animation-delay: -5s; animation-duration: 20s; fill: rgba(0, 0, 0, 0.02); }

    [data-bs-theme="dark"] .waves-container .parallax > use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; fill: rgba(255, 255, 255, 0.08); }
    [data-bs-theme="dark"] .waves-container .parallax > use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; fill: rgba(255, 255, 255, 0.05); }
    [data-bs-theme="dark"] .waves-container .parallax > use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; fill: rgba(255, 255, 255, 0.03); }
    [data-bs-theme="dark"] .waves-container .parallax > use:nth-child(4) { animation-delay: -5s; animation-duration: 20s; fill: rgba(255, 255, 255, 0.02); }

    @keyframes move-forever {
    0% {
    transform: translate3d(-90px,0,0);
    }
    100% {
        transform: translate3d(85px,0,0);
    }
    }
    /* --- End Animated Wave Header --- */

    /* Fix for modal text color in dark mode */
    [data-bs-theme="dark"] .modal-body .form-label,
    [data-bs-theme="dark"] .modal-body h6 {
        color: var(--bs-body-color);
    }

    /* Fix for offcanvas horizontal scrollbar */
    #userOffcanvas .offcanvas-body {
        overflow-x: hidden;
    }

    /* Custom Popover for Image Preview */
    .image-preview-popover {
        border: none;
        box-shadow: var(--bs-box-shadow);
    }

    .image-preview-popover .popover-body {
        padding: 0.25rem; /* Small padding around the image */
        background-color: var(--bs-body-bg);
    }

    .image-preview-popover .popover-header {
        display: none;
    }

    .image-preview-popover .popover-arrow {
        display: none;
    }

    .image-preview-popover .img-fluid {
        max-width: 250px; /* Adjust size as needed */
        height: auto;
        border-radius: var(--bs-popover-border-radius);
    }

    .fc .fc-event {
        font-size: 0.8em;
        padding: 1px 2px;
        white-space: normal; /* Allow text to wrap */
        overflow-wrap: break-word; /* Break long words */
    }

    .fc-event-title {
        white-space: normal; /* Allow text to wrap */
        overflow-wrap: break-word; /* Break long words */
    }

    /* Custom styles for FullCalendar weekend days */
    .fc-day-sat {
        background-color: #fcf6e5 !important; /* Light gray for Saturday */
    }

    .fc-day-sun {
        background-color: #fcf3f4 !important; /* Coral for Sunday */
        color: #fff;
    }

    .fc-day-sun .fc-daygrid-day-number {
        color: #dc3545; /* Red for Sunday dates */
        font-weight: bold;
    }



    .fc-daygrid-day {
        background-color: #f6f6f4;
        border-style: dashed !important;
    }

    .fc .fc-daygrid-event {
        font-weight: bold;
    }

    /* Multi-select component styles for service cards */
    #service-grid-container {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 0.75rem;
        max-height: 350px;
        overflow-y: auto;
        padding: 0.5rem;
        background-color: var(--bs-tertiary-bg);
        border-radius: 0.375rem;
    }

    .service-card {
        border: 1px solid var(--bs-border-color);
        border-radius: 0.375rem;
        padding: 0.75rem;
        cursor: pointer;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }

    .service-card.selected {
        border-color: var(--bs-primary);
        box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.25);
    }

    .service-card-title {
        font-weight: 600;
        margin-bottom: 0.25rem;
    }

    .service-card-description {
        font-size: 0.8rem;
        color: var(--bs-secondary-color);
        margin-bottom: 0.5rem;
    }

    .service-card-date-input {
        display: none;
        margin-top: 0.5rem;
    }

    .service-card.selected .service-card-date-input {
        display: block;
    }