body{
    margin:0;
    font-family:Arial;
    background:#f4f6f9;
}

#app{
    display:flex;
    min-height:100vh;
}

.sidebar{
    width:260px;
    min-height:100vh;
    background:#1f2937;
    color:white;
    padding:20px;
    display:flex;
    flex-direction:column;
}

.sidebar h2{
    margin-top:0;
}

.sidebar button{
    margin-bottom:10px;
    padding:12px;
    border:none;
    background:#374151;
    color:white;
    cursor:pointer;
    border-radius:6px;
    text-align:left;
}

.sidebar button:hover{
    background:#4b5563;
}

.content{
    flex:1;
    padding:30px;
    overflow:auto;
}

.cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.card{
    background:white;
    padding:20px;
    border-radius:10px;
    box-shadow:0 2px 6px rgba(0,0,0,0.1);
}

table{
    width:100%;
    border-collapse:collapse;
    background:white;
}

table th,
table td{
    padding:12px;
    border-bottom:1px solid #ddd;
    text-align:left;
}

.topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.topbar button{
    padding:12px 20px;
    border:none;
    background:#2563eb;
    color:white;
    border-radius:6px;
    cursor:pointer;
}

.modal{
    position:fixed;
    inset:0;
    width:100vw;
    height:100vh;
    background:rgba(0,0,0,0.5);

    display:flex;
    justify-content:center;
    align-items:center;

    padding:20px;
    box-sizing:border-box;

    z-index:99999;
}

.modal-box{
    background:white;
    padding:30px;
    border-radius:10px;
    width:400px;

    max-width:90vw;
    max-height:90vh;

    overflow:auto;

    display:flex;
    flex-direction:column;
    gap:10px;

    margin:auto;
}

.modal-box input,
.modal-box select{
    padding:12px;
}

.modal-box button{
    padding:12px;
    border:none;
    background:#2563eb;
    color:white;
    border-radius:6px;
    cursor:pointer;
}

#login-screen{
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
}

.login-box{
    width:350px;
    background:white;
    padding:30px;
    border-radius:10px;
    box-shadow:0 2px 8px rgba(0,0,0,0.2);
    display:flex;
    flex-direction:column;
    gap:10px;
}

.login-box input{
    padding:12px;
}

.login-box button{
    padding:12px;
    background:#2563eb;
    color:white;
    border:none;
    border-radius:6px;
    cursor:pointer;
}

textarea{
    padding:12px;
    min-height:80px;
    resize:vertical;
    font-family:Arial;
}

table button{
    padding:7px 10px;
    margin-right:5px;
    border:none;
    border-radius:5px;
    cursor:pointer;
    background:#2563eb;
    color:white;
}


.status-ofertowanie{
    background:#fef3c7;
    color:#92400e;
    padding:6px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
}

.status-realizacja{
    background:#dbeafe;
    color:#1e40af;
    padding:6px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
}

.status-zakonczony{
    background:#dcfce7;
    color:#166534;
    padding:6px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
}

.status-przegrany{
    background:#fee2e2;
    color:#991b1b;
    padding:6px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
}

.status-wstrzymany{
    background:#e5e7eb;
    color:#374151;
    padding:6px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
}

.payment-paid{
    background:#dcfce7;
}

.payment-overdue{
    background:#fee2e2;
}

.payment-soon{
    background:#fef3c7;
}

.filters{
    display:flex;
    gap:10px;
    align-items:center;
}

.filters input,
.filters select{
    padding:10px;
    border:1px solid #ccc;
    border-radius:6px;
}

button[onclick*="delete"]{
    background:#dc2626 !important;
    color:white;
}

button[onclick*="delete"]:hover{
    background:#b91c1c !important;
}

.btn-paid{
    background:#16a34a !important;
    color:white;
}

.btn-paid:hover{
    background:#15803d !important;
}

.confirm-box{
    width:360px;
    text-align:center;
    position:relative;
    top:0;
    transform:none;
}

.confirm-box h2{
    margin-top:0;
    color:#111827;
}

.confirm-box p{
    font-size:16px;
    color:#374151;
    line-height:1.5;
}

.confirm-buttons{
    display:flex;
    gap:10px;
    justify-content:center;
    margin-top:15px;
}

.confirm-buttons button{
    min-width:100px;
}

#confirm-ok-button{
    background:#2563eb;
}

#confirm-cancel-button{
    background:#6b7280;
}

#confirm-ok-button:focus{
    outline:3px solid #93c5fd;
}

#confirm-modal .modal-box{
    margin:auto;
}

.dashboard-section{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.dashboard-half{
    background:white;
    padding:20px;
    border-radius:10px;
    box-shadow:0 2px 6px rgba(0,0,0,0.1);
}

.quick-actions{
    display:flex;
    gap:10px;
    margin-bottom:20px;
}

.quick-actions button{
    padding:12px 18px;
    border:none;
    border-radius:6px;
    background:#2563eb;
    color:white;
    cursor:pointer;
    font-weight:bold;
}

.quick-actions button:hover{
    background:#1d4ed8;
}

.payment-summary-cards{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:20px;
    margin-bottom:10px;
}

.payment-summary-cards .card p{
    font-size:24px;
    font-weight:bold;
    margin:0;
}

.topbar-actions{
    display:flex;
    gap:10px;
    align-items:center;
}

.topbar-actions button{
    padding:12px 20px;
    border:none;
    background:#2563eb;
    color:white;
    border-radius:6px;
    cursor:pointer;
}

.topbar-actions button:hover{
    background:#1d4ed8;
}

body{
    background:linear-gradient(135deg, #f8fafc, #eef2ff);
}

/* SIDEBAR */

.sidebar{
    transition:width 0.25s ease;
    background:linear-gradient(180deg, #111827, #1e293b);
}

.sidebar-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:20px;
}

.sidebar-title{
    margin:0;
    white-space:nowrap;
}

.sidebar-toggle{
    width:42px;
    height:42px;
    border-radius:10px;
    background:#334155 !important;
    color:white;
    text-align:center !important;
    padding:0 !important;
    display:flex;
    align-items:center;
    justify-content:center;
}

.sidebar-toggle:hover{
    background:#475569 !important;
}

.sidebar button{
    display:flex;
    align-items:center;
    gap:12px;
    transition:all 0.2s ease;
    font-size:15px;
}

.sidebar button:hover{
    transform:translateX(4px);
    background:linear-gradient(135deg, #475569, #334155);
}

.menu-icon{
    width:24px;
    min-width:24px;
    text-align:center;
    font-size:18px;
}

.menu-text{
    white-space:nowrap;
}

.sidebar.collapsed{
    width:72px;
    padding:20px 10px;
}

.sidebar.collapsed .sidebar-title,
.sidebar.collapsed .menu-text{
    display:none;
}

.sidebar.collapsed button{
    justify-content:center;
    padding:12px 0;
}

.sidebar.collapsed .sidebar-toggle{
    margin:auto;
}

.sidebar.collapsed button:hover{
    transform:none;
}

/* CONTENT */

.content{
    background:linear-gradient(135deg, #f8fafc, #eef2ff);
}

/* DASHBOARD CARDS */

.dashboard-card{
    cursor:pointer;
    position:relative;
    overflow:hidden;
    transition:all 0.25s ease;
    border:1px solid rgba(255,255,255,0.7);
}

.dashboard-card:hover{
    transform:translateY(-6px);
    box-shadow:0 12px 25px rgba(15,23,42,0.18);
}

.dashboard-card h3{
    margin-top:0;
    font-size:16px;
}

.dashboard-card p{
    font-size:30px;
    font-weight:bold;
    margin-bottom:0;
}

.card-projects{
    background:linear-gradient(135deg, #dbeafe, #eff6ff);
}

.card-offers{
    background:linear-gradient(135deg, #fef3c7, #fffbeb);
}

.card-invoice{
    background:linear-gradient(135deg, #ede9fe, #f5f3ff);
}

.card-payments{
    background:linear-gradient(135deg, #dcfce7, #f0fdf4);
}

.card-projects:hover{
    background:linear-gradient(135deg, #bfdbfe, #dbeafe);
}

.card-offers:hover{
    background:linear-gradient(135deg, #fde68a, #fef3c7);
}

.card-invoice:hover{
    background:linear-gradient(135deg, #ddd6fe, #ede9fe);
}

.card-payments:hover{
    background:linear-gradient(135deg, #bbf7d0, #dcfce7);
}

/* SEKCJE DASHBOARD */

.dashboard-half{
    border:1px solid rgba(255,255,255,0.8);
    background:rgba(255,255,255,0.85);
    backdrop-filter:blur(8px);
    transition:all 0.2s ease;
}

.dashboard-half:hover{
    box-shadow:0 10px 22px rgba(15,23,42,0.12);
}

/* OGÓLNE KARTY */

.card{
    transition:all 0.2s ease;
}

.card:hover{
    box-shadow:0 8px 18px rgba(15,23,42,0.12);
}

/* TABELE */

table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    overflow:hidden;

    background:white;

    border-radius:18px;

    box-shadow:
        0 6px 18px rgba(15,23,42,0.06),
        0 2px 6px rgba(15,23,42,0.04);

    margin-top:16px;
}

/* NAGŁÓWKI */

table thead th{

    background:linear-gradient(
        180deg,
        #f8fafc,
        #eef2ff
    );

    color:#334155;

    font-size:12px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:0.04em;

    padding:18px 16px;

    border-bottom:1px solid #e2e8f0;

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

/* WIERSZE */

table tbody tr{
    transition:
        background 0.18s ease,
        transform 0.12s ease;
}

/* HOVER */

table tbody tr:hover{
    background:#f8fafc;
}

/* KOMÓRKI */

table td{

    padding:18px 16px;

    border-bottom:1px solid #eef2ff;

    vertical-align:middle;

    font-size:14px;

    color:#0f172a;
}

/* OSTATNI WIERSZ */

table tbody tr:last-child td{
    border-bottom:none;
}

/* PRZYCISKI */

button{
    transition:all 0.2s ease;
}

button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.15);
}

/* MODALE */

.modal-box{
    box-shadow:0 20px 50px rgba(15,23,42,0.25);
    border:1px solid rgba(255,255,255,0.8);
}

.badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
    letter-spacing:0.02em;
}

.badge-offer{
    background:#fef3c7;
    color:#92400e;
}

.badge-realization{
    background:#dbeafe;
    color:#1e40af;
}

.badge-warning{
    background:#ffedd5;
    color:#9a3412;
}

.badge-done{
    background:#dcfce7;
    color:#166534;
}

.badge-lost{
    background:#fee2e2;
    color:#991b1b;
}

.badge-paused{
    background:#e5e7eb;
    color:#374151;
}

.badge-paid{
    background:#dcfce7;
    color:#166534;
}

.badge-overdue{
    background:#fee2e2;
    color:#991b1b;
}

.badge-waiting{
    background:#fef3c7;
    color:#92400e;
}

.badge-neutral{
    background:#e5e7eb;
    color:#374151;
}

.form-modal{
    width:600px;
}

.form-modal h2{
    margin-top:0;
    margin-bottom:10px;
    color:#0f172a;
}

.form-modal label{
    font-size:13px;
    font-weight:700;
    color:#475569;
    margin-top:6px;
}

.form-modal input,
.form-modal select,
.form-modal textarea{
    width:100%;
    box-sizing:border-box;
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:12px 14px;
    font-size:14px;
    background:#f8fafc;
    transition:all 0.2s ease;
}

.form-modal input:focus,
.form-modal select:focus,
.form-modal textarea:focus{
    outline:none;
    border-color:#2563eb;
    background:white;
    box-shadow:0 0 0 4px rgba(37,99,235,0.12);
}

.form-modal textarea{
    min-height:90px;
}

.form-modal button{
    margin-top:6px;
}

.topbar{
    position:relative;
    z-index:1;
    background:transparent;
    padding:0;
    border-bottom:none;
}

.fade-view{
    opacity:0;
    transform:translateY(8px);
    transition:opacity 0.22s ease, transform 0.22s ease;
}

.fade-view.active-view{
    opacity:1;
    transform:translateY(0);
}

.modal .modal-box{
    animation:modalPop 0.2s ease;
}

@keyframes modalPop{
    from{
        opacity:0;
        transform:scale(0.96) translateY(8px);
    }

    to{
        opacity:1;
        transform:scale(1) translateY(0);
    }
}

tbody tr{
    animation:rowFade 0.18s ease;
}

@keyframes rowFade{
    from{
        opacity:0;
        transform:translateY(4px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}
.view h1{
    margin-bottom:22px;
    color:#0f172a;
    letter-spacing:-0.02em;
}

.view h2{
    margin-bottom:18px;
    color:#0f172a;
}

.filters{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    align-items:center;
}

table td button{

    border:none;

    border-radius:10px;

    padding:10px 14px;

    font-size:13px;
    font-weight:700;

    display:inline-flex;
    align-items:center;
    gap:6px;

    margin-right:6px;

    transition:all 0.18s ease;
}

/* HOVER */

table td button:hover{
    transform:translateY(-1px);
}

/* EDYTUJ */

table td button[onclick*="edit"]{
    background:linear-gradient(
        135deg,
        #2563eb,
        #1d4ed8
    );

    color:white;
}

/* USUŃ */

table td button[onclick*="delete"]{
    background:linear-gradient(
        135deg,
        #dc2626,
        #b91c1c
    ) !important;

    color:white;
}

/* ZAPŁACONE */

.btn-paid{
    background:linear-gradient(
        135deg,
        #16a34a,
        #15803d
    ) !important;

    color:white;
}

.cards{
    gap:20px;
}

.card{
    border-radius:18px;
    overflow:hidden;
}

.card h3{
    font-size:15px;
    margin-bottom:10px;
}

.card p{
    font-size:30px;
}

.content{
    padding:28px;
}

.view{
    padding-bottom:30px;
}

select{
    cursor:pointer;
}

input,
select,
textarea{
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
} .dashboard-offers-ending{
    grid-column:1 / -1;
}

.details-modal{
    width:820px;
    max-width:92vw;
}

.details-grid{
    display:flex;
    flex-direction:column;
    gap:18px;
    margin-bottom:20px;
}

.details-grid label{
    font-size:12px;
    color:#666;
    display:block;
    margin-bottom:4px;
}

.details-grid p{
    font-weight:600;
}

.details-notes{
    background:#f4f6fb;
    padding:12px;
    border-radius:10px;
    margin-bottom:20px;
    min-height:60px;
}

.project-modal-box{
    width:1600px;
    max-width:94vw;
}

.modal-tabs{
    display:flex;
    gap:8px;
    margin-bottom:16px;
    flex-wrap:wrap;
}

.modal-tabs button{
    background:#e5e7eb;
    color:#111827;
}

.project-tab-content{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.modal-actions-fixed{
    display:flex;
    gap:10px;
    justify-content:flex-end;
    margin-top:20px;
    padding-top:16px;
    border-top:1px solid #e5e7eb;
    background:white;
    position:sticky;
    bottom:0;
}

.details-tab-content{
    min-height:260px;
}

.modal-tabs{
    border-bottom:1px solid #d1d5db;
    padding-bottom:0;
    gap:0;
}

.modal-tabs button{
    background:#e5e7eb;
    color:#374151;
    border-radius:10px 10px 0 0;
    border:1px solid #d1d5db;
    border-bottom:none;
    padding:12px 18px;
    margin-right:4px;
    font-weight:700;
}

.modal-tabs button.active-tab{
    background:white;
    color:#2563eb;
    position:relative;
    top:1px;
    box-shadow:none;
}

.details-grid{
    align-items:start;
}

.details-grid p{
    margin:4px 0 0 0;
    font-size:16px;
    font-weight:600;
    color:#111827;
}

.details-grid label{
    font-size:13px;
    font-weight:700;
    color:#6b7280;
    text-transform:uppercase;
    letter-spacing:0.04em;
}
.details-grid p{
    min-height:22px;
    padding-bottom:6px;
    border-bottom:1px solid #eef2ff;
}

.settings-tabs{
    display:flex;
    gap:0;
    border-bottom:1px solid #d1d5db;
    margin-bottom:18px;
}

.settings-tabs button{
    background:#e5e7eb;
    color:#374151;
    border:none;
    border-radius:10px 10px 0 0;
    padding:12px 18px;
    margin-right:4px;
    font-weight:700;
    cursor:pointer;
}

.settings-tabs button.active-tab{
    background:white;
    color:#2563eb;
    position:relative;
    top:1px;
}

button i {
    margin-right: 6px;
}

#project-resource-modal{
    z-index:100001;
}

#project-resource-modal .modal-box{
    z-index:100002;
}

#project-employee-modal{
    z-index:100001;
}

#project-employee-modal .modal-box{
    z-index:100002;
}

#project-tab-resources-edit table th,
#project-tab-resources-edit table td{
    white-space:normal;
}

#project-tab-resources-edit table td{
    vertical-align:middle;
}

#resource-conflict-modal{
    z-index:100003;
}

#resource-conflict-modal .modal-box{
    z-index:100004;
}

.sidebar-brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.sidebar-logo{
    width:42px;
    height:42px;
    flex-shrink:0;
}

.login-logo{
    width:90px;
    height:90px;
    margin-bottom:20px;
}

#login-screen{
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:100vh;
}

.login-box{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.login-logo{
    width:140px;
    height:140px;
    margin-bottom:24px;
    display:block;
}

#confirm-modal{
    z-index:100100 !important;
}

#confirm-modal .modal-box{
    z-index:100101 !important;
}

#project-task-modal{
    z-index:100001;
}

#project-task-modal .modal-box{
    z-index:100002;
}
#project-task-employees-modal{
    z-index:100003;
}

#project-task-employees-modal .modal-box{
    z-index:100004;
}

#project-task-resources-modal{
    z-index:100005;
}

#project-task-resources-modal .modal-box{
    z-index:100006;
}

#project-tasks-edit-table td:nth-child(5),
#project-tasks-edit-table td:nth-child(6),
#project-tasks-edit-table td:nth-child(7),
#project-tasks-edit-table td:nth-child(9){
    text-align:center;
}

#project-tasks-edit-table td:nth-child(5) button,
#project-tasks-edit-table td:nth-child(6) button,
#project-tasks-edit-table td:nth-child(7) button,
#project-tasks-edit-table td:nth-child(9) button{
    justify-content:center;
    margin:auto;
}

.project-details-modal-box{
    width:1400px;
    max-width:98vw;
}
.form-control{
    width:100%;
    padding:10px 12px;
    border:1px solid #d1d5db;
    border-radius:8px;
    box-sizing:border-box;
    margin-bottom:10px;
}

#project-task-dependencies-modal{
    z-index:100007;
}

#project-task-dependencies-modal .modal-box{
    z-index:100008;
}

#task-conflict-modal{
    z-index:100009;
}

#task-conflict-modal .modal-box{
    z-index:100010;
}

.app-modal-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-bottom:14px;
    padding-bottom:14px;
    border-bottom:1px solid #e2e8f0;
}

.app-modal-header h2{
    margin:0;
    color:#0f172a;
}

.app-modal-close{
    width:38px;
    height:38px;
    min-width:38px;
    border:none;
    border-radius:10px;
    background:#f1f5f9 !important;
    color:#0f172a !important;
    font-size:18px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 !important;
}

.app-modal-close:hover{
    background:#e2e8f0 !important;
    transform:none;
    box-shadow:none;
}
.contact-select-row{
    display:flex;
    gap:8px;
    align-items:center;
}

.contact-select-row select{
    flex:1;
}

.contact-details-button{
    width:32px;
    height:32px;
    min-width:32px;

    padding:0 !important;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    font-size:14px;

    position:relative;
    top:-4px;
}

.badge-dead{
    background:#111827;
    color:white;
}

.submenu{
    margin-left:28px;
    margin-bottom:10px;
}

.submenu button{
    background:#263244;
    font-size:13px;
    padding:9px 10px;
    margin-bottom:6px;
}

.submenu button:hover{
    background:#3b4658;
}

#project-file-modal{
    z-index:3000;
}

#project-file-modal{
    z-index:100020 !important;
}

#project-file-modal .modal-box{
    z-index:100021 !important;
}

input[type="file"]{
    background:#f8fafc;
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:12px 14px;
    font-size:14px;
    cursor:pointer;
}
.file-upload-input{
    width:100%;
    padding:10px;
    border:1px solid #d1d5db;
    border-radius:10px;
    background:white;
    box-sizing:border-box;
}

.file-upload-input::file-selector-button{
    background:#2563eb;
    color:white;
    border:none;
    border-radius:8px;
    padding:10px 14px;
    margin-right:12px;
    cursor:pointer;
    font-weight:600;
}

.file-upload-input::file-selector-button:hover{
    opacity:0.9;
}

#complaint-file-modal{
    z-index:100030 !important;
}

#complaint-file-modal .modal-box{
    z-index:100031 !important;
}

.calendar-event-default{
    background:#2563eb !important;
}

.calendar-event-bad{
    background:#dc2626 !important;
}

.calendar-event-bhp{
    background:#f97316 !important;
}

.calendar-event-sep{
    background:#7c3aed !important;
}

.calendar-event-oc{
    background:#16a34a !important;
}

.calendar-event-serwis{
    background:#0f172a !important;
}

.calendar-event-przeglad{
    background:#0891b2 !important;
}

.color-picker-row{
    display:flex;
    align-items:center;
    gap:12px;
}

.color-picker-row input[type="color"]{
    width:64px;
    height:42px;
    padding:4px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    background:white;
    cursor:pointer;
}

.color-picker-row span{
    font-weight:800;
    color:#334155;
}

.dashboard-upcoming-events{
    background:
        linear-gradient(
            135deg,
            rgba(239,246,255,0.96),
            rgba(226,232,240,0.86)
        );

    border:1px solid rgba(191,219,254,0.85);
    border-radius:18px;
    padding:20px;

    box-shadow:
        0 10px 24px rgba(15,23,42,0.08),
        inset 0 1px 0 rgba(255,255,255,0.75);

    margin-bottom:16px;
}

.dashboard-upcoming-events h2{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
    font-size:18px;
    color:#0f172a;
}

.dashboard-upcoming-events h2 i{
    color:#2563eb;
}

.dashboard-upcoming-events table{
    width:100%;
    border-collapse:collapse;
}

.dashboard-upcoming-events thead{
    background:#f8fafc;
}

.dashboard-upcoming-events th{
    padding:10px;
    text-align:left;
    font-size:13px;
    font-weight:700;
    color:#475569;
    border-bottom:1px solid #e2e8f0;
}

.dashboard-upcoming-events td{
    padding:10px;
    border-bottom:1px solid #f1f5f9;
}

.dashboard-upcoming-events tbody tr:hover{
    background:#f8fafc;
}

.dashboard-event-badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:999px;
    background:#eff6ff;
    color:#2563eb;
    font-weight:600;
    font-size:12px;
}

.dashboard-event-soon{
    background:#fffbeb;
}

.dashboard-event-urgent{
    background:#fef2f2;
}

.dashboard-event-soon:hover{
    background:#fef3c7 !important;
}

.dashboard-event-urgent:hover{
    background:#fee2e2 !important;
}

.dashboard-upcoming-events td small{
    color:#64748b;
    font-size:11px;
}

.dashboard-upcoming-events td strong{
    color:#0f172a;
}

.dashboard-upcoming-events tbody tr{
    cursor:pointer;
}

.dashboard-event-preview-modal{
    max-width:520px;
}

.dashboard-event-preview-modal p{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:10px;
    padding:10px 12px;
    margin:0 0 12px 0;
    color:#0f172a;
}

.export-modal-box{
    width:900px;
    max-width:95vw;
}

.export-modal-description{
    color:#475569;
    line-height:1.5;
    margin-top:0;
}

.backup-choice-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.backup-choice-card{
    background:linear-gradient(135deg, #ffffff, #eef2ff);
    border:1px solid #dbeafe;
    color:#0f172a;
    border-radius:18px;
    padding:24px;
    cursor:pointer;
    text-align:left;
    display:flex;
    flex-direction:column;
    gap:12px;
    min-height:170px;
}

.backup-choice-card:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 25px rgba(15,23,42,0.14);
}

.backup-choice-card i{
    font-size:34px;
    color:#2563eb;
}

.backup-choice-card strong{
    font-size:19px;
    color:white;
}

.backup-choice-card span{
    color:#dbeafe;
    line-height:1.4;
}

.export-panel-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:14px;
}

.export-panel-header h3{
    margin:0;
}

.export-panel-actions{
    display:flex;
    gap:8px;
}

.export-panel-actions button{
    background:#64748b;
}

.export-checkbox-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    max-height:55vh;
    overflow:auto;
    padding-right:6px;
}

.export-checkbox-card{
    display:flex;
    gap:12px;
    align-items:flex-start;
    background:white;
    border:1px solid #dbeafe;
    border-radius:14px;
    padding:14px;
    cursor:pointer;
    transition:all 0.18s ease;
}

.export-checkbox-card:hover{
    background:#f8fafc;
    box-shadow:0 6px 14px rgba(15,23,42,0.08);
}

.export-checkbox-card input{
    margin-top:4px;
    width:18px;
    height:18px;
}

.export-checkbox-card span{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.export-checkbox-card strong{
    color:#0f172a;
}

.export-checkbox-card small{
    color:#64748b;
    line-height:1.35;
}

.secondary-button{
    background:#64748b !important;
}

@media(max-width:800px){

    .backup-choice-grid,
    .export-checkbox-grid{
        grid-template-columns:1fr;
    }

    .export-panel-header{
        align-items:flex-start;
        flex-direction:column;
    }
}

.account-menu-button{
    margin-top:8px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    box-shadow:0 8px 18px rgba(37,99,235,0.25);
}

.account-menu-button:hover{
    background:linear-gradient(135deg, #1d4ed8, #1e40af) !important;
}

.account-modal-box{
    width:980px;
    max-width:95vw;
    padding:0;
    overflow:hidden;
    border-radius:24px;
    background:#f8fafc;
}

.account-modal-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:26px 30px;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.28), transparent 35%),
        linear-gradient(135deg, #0f172a, #1e293b);
    color:white;
}

.account-profile-block{
    display:flex;
    align-items:center;
    gap:18px;
}

.account-profile-block h2{
    margin:0;
    color:white;
    font-size:28px;
}

.account-profile-block p{
    margin:5px 0 0 0;
    color:#cbd5e1;
}

.account-avatar{
    width:64px;
    height:64px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,0.14);
    border:1px solid rgba(255,255,255,0.22);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.2);
}

.account-avatar i{
    font-size:30px;
    color:white;
}

.account-close-button{
    width:44px;
    height:44px;
    border:none;
    border-radius:14px;
    background:rgba(255,255,255,0.12) !important;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.account-close-button:hover{
    background:rgba(255,255,255,0.22) !important;
}

.account-version-badge{
    display:flex;
    align-items:center;
    gap:8px;
    padding:14px 30px;
    background:white;
    border-bottom:1px solid #e2e8f0;
    color:#475569;
    font-size:14px;
}

.account-version-badge strong{
    color:#2563eb;
}

.account-modal-layout{
    display:grid;
    grid-template-columns:270px 1fr;
    min-height:470px;
}

.account-tabs{
    padding:22px;
    background:#eef2ff;
    border-right:1px solid #dbeafe;
    display:flex;
    flex-direction:column;
    gap:10px;
}

.account-tabs button{
    width:100%;
    border:none;
    border-radius:16px;
    padding:15px 16px;
    background:transparent;
    color:#334155;
    display:flex;
    align-items:center;
    gap:12px;
    text-align:left;
    font-weight:800;
    cursor:pointer;
}

.account-tabs button i{
    width:22px;
    text-align:center;
    color:#2563eb;
}

.account-tabs button:hover{
    background:white;
    box-shadow:0 8px 18px rgba(15,23,42,0.08);
}

.account-tabs button.active{
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    box-shadow:0 12px 22px rgba(37,99,235,0.28);
}

.account-tabs button.active i{
    color:white;
}

.account-content{
    padding:30px;
    background:white;
}

.account-tab-content h3{
    margin-top:0;
    font-size:24px;
    color:#0f172a;
}

.account-tab-content p{
    color:#475569;
    line-height:1.6;
}

.account-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    margin-top:20px;
}

.account-info-card{
    padding:20px;
    border-radius:18px;
    background:linear-gradient(135deg, #f8fafc, #eef2ff);
    border:1px solid #dbeafe;
}

.account-info-card span{
    display:block;
    font-size:13px;
    color:#64748b;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.account-info-card strong{
    display:block;
    font-size:18px;
    color:#0f172a;
}

.account-note{
    margin-top:20px;
    padding:18px;
    border-radius:18px;
    background:#eff6ff;
    color:#1e40af;
    display:flex;
    gap:12px;
    line-height:1.5;
    border:1px solid #bfdbfe;
}

.account-note i{
    margin-top:3px;
}

.account-primary-link{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:10px;
    padding:14px 18px;
    border-radius:14px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    text-decoration:none;
    font-weight:800;
    box-shadow:0 10px 18px rgba(37,99,235,0.25);
}

.account-primary-link:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(37,99,235,0.32);
}

.account-help-list{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-top:24px;
}

.account-help-list div{
    display:flex;
    gap:12px;
    align-items:flex-start;
    padding:16px;
    border-radius:16px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#334155;
}

.account-help-list i{
    color:#2563eb;
    margin-top:2px;
}

.account-version-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:20px;
    border-radius:18px;
    background:linear-gradient(135deg, #eff6ff, #eef2ff);
    border:1px solid #bfdbfe;
}

.account-version-card strong{
    display:block;
    font-size:20px;
    color:#0f172a;
}

.account-version-card span{
    display:block;
    margin-top:4px;
    color:#64748b;
}

.account-status-pill{
    padding:8px 12px;
    border-radius:999px;
    background:#dcfce7;
    color:#166534 !important;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
}

.account-changelog{
    margin-top:22px;
    padding:20px;
    border-radius:18px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}

.account-changelog h4{
    margin-top:0;
    color:#0f172a;
}

.account-changelog ul{
    margin-bottom:0;
    color:#475569;
    line-height:1.8;
}

.account-logout-box{
    display:flex;
    gap:16px;
    align-items:center;
    padding:20px;
    border-radius:18px;
    background:#fff7ed;
    border:1px solid #fed7aa;
    color:#9a3412;
    margin-top:20px;
}

.account-logout-box i{
    font-size:28px;
}

.account-logout-box strong{
    display:block;
    color:#7c2d12;
}

.account-logout-box span{
    display:block;
    margin-top:4px;
    color:#9a3412;
}

.account-actions{
    display:flex;
    justify-content:flex-end;
    gap:12px;
    margin-top:24px;
}

.account-secondary-button{
    background:#64748b !important;
}

.account-danger-button{
    background:linear-gradient(135deg, #dc2626, #b91c1c) !important;
    color:white;
}

@media(max-width:850px){

    .account-modal-layout{
        grid-template-columns:1fr;
    }

    .account-tabs{
        border-right:none;
        border-bottom:1px solid #dbeafe;
    }

    .account-info-grid{
        grid-template-columns:1fr;
    }

    .account-modal-header{
        align-items:flex-start;
        gap:16px;
    }
}

/* =========================
   CENTRUM POWIADOMIEŃ
   ========================= */

.notification-center{
    position:fixed;
    right:32px;
    bottom:28px;
    z-index:9999;
}

.notification-bell-button{
    position:relative;
    width:52px;
    height:52px;
    border:none;
    border-radius:18px;
    background:
        radial-gradient(circle at top left, rgba(96,165,250,0.65), transparent 45%),
        linear-gradient(135deg, #0f172a, #1e293b);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:
        0 18px 38px rgba(15,23,42,0.28),
        inset 0 1px 0 rgba(255,255,255,0.16);
}

.notification-bell-button i{
    font-size:21px;
}

.notification-bell-button:hover{
    transform:translateY(-2px);
    box-shadow:
        0 22px 48px rgba(15,23,42,0.34),
        inset 0 1px 0 rgba(255,255,255,0.18);
}

.notification-count-badge{
    position:absolute;
    top:-7px;
    right:-7px;
    min-width:24px;
    height:24px;
    padding:0 6px;
    border-radius:999px;
    background:linear-gradient(135deg, #ef4444, #b91c1c);
    color:white;
    font-size:12px;
    font-weight:900;
    align-items:center;
    justify-content:center;
    border:3px solid #f8fafc;
    box-shadow:0 8px 16px rgba(239,68,68,0.35);
}

.notification-count-badge.pulse{
    animation:notificationPulse 1.8s infinite;
}

@keyframes notificationPulse{
    0%{
        box-shadow:0 0 0 0 rgba(239,68,68,0.45);
    }

    70%{
        box-shadow:0 0 0 9px rgba(239,68,68,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(239,68,68,0);
    }
}

.notifications-panel{
    position:absolute;
    bottom:66px;
    right:0;
    width:460px;
    max-width:calc(100vw - 32px);
    background:rgba(255,255,255,0.96);
    backdrop-filter:blur(18px);
    border:1px solid rgba(226,232,240,0.95);
    border-radius:26px;
    box-shadow:
        0 30px 70px rgba(15,23,42,0.24),
        0 8px 22px rgba(15,23,42,0.10);
    overflow:hidden;
    animation:notificationsPanelIn 0.22s ease;
}

@keyframes notificationsPanelIn{
    from{
        opacity:0;
        transform:translateY(8px) scale(0.98);
    }

    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

.notifications-panel-header{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    padding:24px;
    color:white;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.45), transparent 38%),
        linear-gradient(135deg, #0f172a, #1e293b);
}

.notifications-panel-header h3{
    margin:0;
    font-size:22px;
    color:white;
}

.notifications-panel-header p{
    margin:5px 0 0 0;
    color:#cbd5e1;
    font-size:14px;
}

.notifications-panel-header button{
    width:38px;
    height:38px;
    border:none;
    border-radius:13px;
    background:rgba(255,255,255,0.12);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.notifications-panel-header button:hover{
    background:rgba(255,255,255,0.22);
}

.notifications-summary{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:10px;
    padding:16px;
    background:#f8fafc;
    border-bottom:1px solid #e2e8f0;
}

.notification-summary-card{
    padding:14px;
    border-radius:17px;
    background:white;
    border:1px solid #e2e8f0;
    text-align:center;
}

.notification-summary-card span{
    display:block;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.05em;
    color:#64748b;
    margin-bottom:5px;
}

.notification-summary-card strong{
    display:block;
    font-size:24px;
    color:#0f172a;
}

.notification-summary-card.urgent{
    background:#fef2f2;
    border-color:#fecaca;
}

.notification-summary-card.urgent strong{
    color:#b91c1c;
}

.notification-summary-card.warning{
    background:#fffbeb;
    border-color:#fde68a;
}

.notification-summary-card.warning strong{
    color:#b45309;
}

.notification-summary-card.info{
    background:#eff6ff;
    border-color:#bfdbfe;
}

.notification-summary-card.info strong{
    color:#1d4ed8;
}

.notifications-list{
    max-height:430px;
    overflow:auto;
    padding:12px;
    background:white;
}

.notification-item{
    display:grid;
    grid-template-columns:46px 1fr 18px;
    gap:13px;
    align-items:flex-start;
    padding:15px;
    border-radius:18px;
    cursor:pointer;
    border:1px solid transparent;
    transition:all 0.18s ease;
    margin-bottom:10px;
}

.notification-item:hover{
    transform:translateY(-1px);
    box-shadow:0 12px 24px rgba(15,23,42,0.10);
}

.notification-item.urgent{
    background:#fff7f7;
    border-color:#fecaca;
}

.notification-item.warning{
    background:#fffbeb;
    border-color:#fde68a;
}

.notification-item.info{
    background:#f8fafc;
    border-color:#e2e8f0;
}

.notification-icon{
    width:46px;
    height:46px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:white;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.2);
}

.notification-item.urgent .notification-icon{
    background:linear-gradient(135deg, #ef4444, #b91c1c);
}

.notification-item.warning .notification-icon{
    background:linear-gradient(135deg, #f59e0b, #b45309);
}

.notification-item.info .notification-icon{
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
}

.notification-content{
    min-width:0;
}

.notification-topline{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:6px;
}

.notification-category{
    font-size:11px;
    font-weight:900;
    color:#64748b;
    text-transform:uppercase;
    letter-spacing:0.05em;
}

.notification-severity{
    display:inline-flex;
    align-items:center;
    padding:4px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.notification-severity.urgent{
    background:#fee2e2;
    color:#991b1b;
}

.notification-severity.warning{
    background:#fef3c7;
    color:#92400e;
}

.notification-severity.info{
    background:#dbeafe;
    color:#1e40af;
}

.notification-content strong{
    display:block;
    font-size:15px;
    color:#0f172a;
    margin-bottom:5px;
}

.notification-content p{
    margin:0;
    color:#475569;
    font-size:13px;
    line-height:1.45;
}

.notification-arrow{
    color:#94a3b8;
    align-self:center;
}

.notifications-empty{
    min-height:210px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:8px;
    color:#64748b;
}

.notifications-empty i{
    font-size:44px;
    color:#16a34a;
    margin-bottom:6px;
}

.notifications-empty strong{
    color:#0f172a;
    font-size:18px;
}

.notifications-empty span{
    color:#64748b;
}

.notifications-footer{
    display:flex;
    justify-content:flex-end;
    padding:14px 18px;
    background:#f8fafc;
    border-top:1px solid #e2e8f0;
}

.notifications-footer button{
    display:inline-flex;
    align-items:center;
    gap:8px;
    border:none;
    border-radius:13px;
    padding:11px 14px;
    background:#2563eb;
    color:white;
    cursor:pointer;
    font-weight:800;
}

.notifications-footer button:hover{
    background:#1d4ed8;
}

@media(max-width:850px){

    .notification-center{
        right:18px;
        bottom:18px;
    }

    .notifications-panel{
        width:calc(100vw - 36px);
        max-height:calc(100vh - 120px);
    }

    .notifications-list{
        max-height:320px;
    }

    .notifications-summary{
        grid-template-columns:1fr;
    }
}

/* =========================
   CENTRUM DOWODZENIA
   ========================= */

.command-center-dashboard{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    padding:22px;
    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.28), transparent 34%),
        radial-gradient(circle at bottom right, rgba(14,165,233,0.18), transparent 30%),
        linear-gradient(135deg, #0f172a, #1e293b);
    box-shadow:
        0 24px 60px rgba(15,23,42,0.22),
        inset 0 1px 0 rgba(255,255,255,0.12);
    color:white;
}

.command-center-dashboard::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,0.08),
            transparent 28%,
            transparent 70%,
            rgba(255,255,255,0.05)
        );
}

.command-center-hero{
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    margin-bottom:18px;
}

.command-center-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,255,255,0.12);
    border:1px solid rgba(255,255,255,0.18);
    color:#dbeafe;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.06em;
    margin-bottom:12px;
}

.command-center-hero h2{
    margin:0;
    color:white;
    font-size:30px;
    letter-spacing:-0.03em;
}

.command-center-hero p{
    margin:8px 0 0 0;
    color:#cbd5e1;
    line-height:1.5;
}

.command-center-hero button{
    border:none;
    border-radius:16px;
    padding:12px 16px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:rgba(255,255,255,0.14);
    color:white;
    font-weight:800;
    cursor:pointer;
    border:1px solid rgba(255,255,255,0.18);
}

.command-center-hero button:hover{
    background:rgba(255,255,255,0.24);
}

.command-center-stats{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:14px;
    margin-bottom:18px;
}

.command-stat-card{
    padding:18px;
    border-radius:22px;
    background:rgba(255,255,255,0.12);
    border:1px solid rgba(255,255,255,0.16);
    backdrop-filter:blur(12px);
}

.command-stat-card span{
    display:block;
    color:#cbd5e1;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.05em;
    margin-bottom:8px;
}

.command-stat-card strong{
    display:block;
    color:white;
    font-size:34px;
    line-height:1;
}

.command-stat-card.urgent strong{
    color:#fecaca;
}

.command-stat-card.warning strong{
    color:#fde68a;
}

.command-stat-card.projects strong{
    color:#bfdbfe;
}

.command-stat-card.tasks strong{
    color:#bbf7d0;
}

.command-center-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:16px;
}

.command-panel{
    overflow:hidden;
    border-radius:24px;
    background:rgba(255,255,255,0.96);
    color:#0f172a;
    border:1px solid rgba(255,255,255,0.7);
    box-shadow:0 12px 28px rgba(15,23,42,0.16);
}

.command-panel-header{
    padding:18px 18px 12px 18px;
    border-bottom:1px solid #e2e8f0;
    background:linear-gradient(180deg, #ffffff, #f8fafc);
}

.command-panel-header h3{
    margin:0;
    display:flex;
    align-items:center;
    gap:10px;
    color:#0f172a;
    font-size:17px;
}

.command-panel-header h3 i{
    color:#2563eb;
}

.command-panel-header p{
    margin:6px 0 0 0;
    color:#64748b;
    font-size:13px;
    line-height:1.4;
}

.command-list{
    padding:12px;
    max-height:390px;
    overflow:auto;
}

.command-item{
    display:grid;
    grid-template-columns:42px 1fr 16px;
    gap:12px;
    align-items:flex-start;
    padding:13px;
    border-radius:18px;
    border:1px solid transparent;
    cursor:pointer;
    transition:all 0.18s ease;
    margin-bottom:10px;
}

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

.command-item:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(15,23,42,0.10);
}

.command-item.urgent{
    background:#fff7f7;
    border-color:#fecaca;
}

.command-item.warning{
    background:#fffbeb;
    border-color:#fde68a;
}

.command-item.info{
    background:#f8fafc;
    border-color:#e2e8f0;
}

.command-item-icon{
    width:42px;
    height:42px;
    border-radius:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:white;
}

.command-item.urgent .command-item-icon{
    background:linear-gradient(135deg, #ef4444, #b91c1c);
}

.command-item.warning .command-item-icon{
    background:linear-gradient(135deg, #f59e0b, #b45309);
}

.command-item.info .command-item-icon{
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
}

.command-item-content{
    min-width:0;
}

.command-item-topline{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:5px;
}

.command-item-meta{
    font-size:10px;
    font-weight:900;
    color:#64748b;
    text-transform:uppercase;
    letter-spacing:0.05em;
}

.command-item-priority{
    display:inline-flex;
    padding:4px 7px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.command-item-priority.urgent{
    background:#fee2e2;
    color:#991b1b;
}

.command-item-priority.warning{
    background:#fef3c7;
    color:#92400e;
}

.command-item-priority.info{
    background:#dbeafe;
    color:#1e40af;
}

.command-item-content strong{
    display:block;
    color:#0f172a;
    font-size:14px;
    margin-bottom:4px;
}

.command-item-content p{
    margin:0;
    color:#475569;
    font-size:12.5px;
    line-height:1.42;
}

.command-item-arrow{
    align-self:center;
    color:#94a3b8;
}

.command-empty{
    min-height:130px;
    border-radius:18px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-align:center;
    background:#f8fafc;
    border:1px dashed #cbd5e1;
    color:#64748b;
    font-weight:700;
}

.command-empty i{
    font-size:30px;
    color:#16a34a;
}

@media(max-width:1200px){

    .command-center-grid{
        grid-template-columns:1fr;
    }

    .command-list{
        max-height:none;
    }
}

@media(max-width:850px){

    .command-center-hero{
        flex-direction:column;
    }

    .command-center-stats{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:560px){

    .command-center-stats{
        grid-template-columns:1fr;
    }

    .command-center-hero h2{
        font-size:24px;
    }
}
.dashboard-collapsible-section{
    background:white;
    border-radius:18px;
    box-shadow:0 6px 18px rgba(15,23,42,0.08);
    border:1px solid #e2e8f0;
    overflow:hidden;
}

.dashboard-collapsible-header{
    cursor:pointer;
    padding:20px;
    font-size:22px;
    font-weight:800;
    color:#0f172a;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    list-style:none;
}

.dashboard-collapsible-header .dashboard-section-heading{
    flex:1;
    justify-content:flex-start;
    text-align:left;
}

.dashboard-collapsible-header .dashboard-section-heading > div:last-child{
    text-align:left;
}

.dashboard-collapsible-header .dashboard-collapsible-hint{
    margin-left:auto;
    white-space:nowrap;
}

.dashboard-collapsible-header::-webkit-details-marker{
    display:none;
}


.dashboard-collapsible-hint{
    font-size:13px;
    font-weight:700;
    color:#64748b;
}

.dashboard-collapsible-section[open] .dashboard-collapsible-hint{
    font-size:0;
}

.dashboard-collapsible-section[open] .dashboard-collapsible-hint::after{
    content:"Kliknij, aby zwinąć";
    font-size:13px;
}

.dashboard-collapsible-content{
    padding:0 20px 20px 20px;
}

.dashboard-number-animating{
    transform:scale(1.08);
    text-shadow:0 8px 18px rgba(37,99,235,0.22);
}

.dashboard-card p{
    transition:
        transform 0.25s ease,
        text-shadow 0.25s ease;
}

.notification-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:12px;
}

.notification-actions button{
    border:none;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.notification-actions button:hover{
    transform:translateY(-1px);
}

.notification-done-button{
    background:#dcfce7;
    color:#166534;
}

.notification-delete-button{
    background:#fee2e2;
    color:#991b1b;
}

.notification-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:12px;
}

.notification-actions button{
    border:none;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.notification-actions button:hover{
    transform:translateY(-1px);
}

.notification-done-button{
    background:#dcfce7;
    color:#166534;
}

.notification-delete-button{
    background:#fee2e2;
    color:#991b1b;
}

.notification-done{
    opacity:0.58;
    background:#f8fafc;
}

.notification-done .notification-icon{
    background:#dcfce7;
    color:#166534;
}

.notification-done strong,
.notification-done p{
    text-decoration:none;
    color:#64748b;
}

.notification-done-label{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:7px 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    background:#e2e8f0;
    color:#475569;
}

.dashboard-section-heading{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:18px;
}

.dashboard-section-heading-no-margin{
    margin-bottom:0;
}

.dashboard-section-icon{
    width:46px;
    height:46px;
    min-width:46px;
    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:linear-gradient(135deg, #dbeafe, #eef2ff);
    color:#2563eb;

    box-shadow:
        0 10px 22px rgba(37,99,235,0.16),
        inset 0 1px 0 rgba(255,255,255,0.7);
}

.dashboard-section-icon i{
    margin:0;
    font-size:18px;
}

.dashboard-section-icon.warning{
    background:linear-gradient(135deg, #fef3c7, #fff7ed);
    color:#d97706;
    box-shadow:
        0 10px 22px rgba(217,119,6,0.16),
        inset 0 1px 0 rgba(255,255,255,0.7);
}

.dashboard-section-icon.danger{
    background:linear-gradient(135deg, #fee2e2, #fff1f2);
    color:#dc2626;
    box-shadow:
        0 10px 22px rgba(220,38,38,0.16),
        inset 0 1px 0 rgba(255,255,255,0.7);
}

.dashboard-section-heading h2{
    margin:0;
    font-size:22px;
    line-height:1.15;
    letter-spacing:-0.03em;
    color:#0f172a;
}

.dashboard-section-heading p{
    margin:5px 0 0 0;
    font-size:13px;
    line-height:1.35;
    color:#64748b;
}

.dashboard-half,
.dashboard-upcoming-events,
.dashboard-lost-projects{
    position:relative;
    overflow:hidden;
}

.dashboard-half::before,
.dashboard-upcoming-events::before,
.dashboard-lost-projects::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;

    background:linear-gradient(
        90deg,
        #1e3a8a,
        #2563eb,
        #38bdf8
    );

    opacity:0.9;
}

.dashboard-half:hover,
.dashboard-upcoming-events:hover,
.dashboard-lost-projects:hover{
    transform:translateY(-3px);
    box-shadow:
        0 18px 36px rgba(15,23,42,0.14),
        0 6px 14px rgba(15,23,42,0.08);
}

.dashboard-section-icon,
.dashboard-smart-insight-icon,
.command-stat-card,
.notification-bell-button{
    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        filter 0.22s ease;
}

.dashboard-section-heading:hover .dashboard-section-icon,
.dashboard-smart-insight:hover .dashboard-smart-insight-icon{
    transform:translateY(-3px) scale(1.04);
    filter:saturate(1.15);

    box-shadow:
        0 16px 30px rgba(37,99,235,0.22),
        inset 0 1px 0 rgba(255,255,255,0.8);
}

.dashboard-section-heading:hover .dashboard-section-icon.warning{
    box-shadow:
        0 16px 30px rgba(217,119,6,0.22),
        inset 0 1px 0 rgba(255,255,255,0.8);
}

.dashboard-section-heading:hover .dashboard-section-icon.danger{
    box-shadow:
        0 16px 30px rgba(220,38,38,0.22),
        inset 0 1px 0 rgba(255,255,255,0.8);
}

.dashboard-section-icon i,
.dashboard-smart-insight-icon i{
    transition:transform 0.22s ease;
}

.dashboard-section-heading:hover .dashboard-section-icon i,
.dashboard-smart-insight:hover .dashboard-smart-insight-icon i{
    transform:scale(1.08) rotate(-4deg);
}

#dashboard table tbody tr{
    position:relative;
    transition:
        background 0.22s ease,
        box-shadow 0.22s ease,
        transform 0.22s ease;
}

#dashboard table tbody tr:hover{
    background:linear-gradient(
        90deg,
        rgba(239,246,255,0.92),
        rgba(255,255,255,0.98)
    ) !important;

    transform:translateX(1px);

    box-shadow:
        inset 4px 0 0 #2563eb,
        0 8px 18px rgba(15,23,42,0.08);
}

#dashboard table tbody tr:hover td:first-child{
    font-weight:800;
    color:#1d4ed8;
}

#dashboard table tbody tr td{
    transition:
        color 0.18s ease,
        background 0.18s ease;
}

#dashboard table tbody tr:hover td{
    border-bottom-color:#dbeafe;
}

.command-center-dashboard{
    position:relative;
    overflow:hidden;
    isolation:isolate;

    border:1px solid rgba(147,197,253,0.55);

    box-shadow:
        0 24px 60px rgba(30,58,138,0.20),
        0 10px 24px rgba(15,23,42,0.10),
        inset 0 1px 0 rgba(255,255,255,0.35);
}

.command-center-dashboard::before{
    content:"";
    position:absolute;
    left:24px;
    right:24px;
    top:0;
    height:4px;
    z-index:1;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(96,165,250,0.95),
        rgba(168,85,247,0.75),
        rgba(56,189,248,0.95),
        transparent
    );

    border-radius:999px;
    opacity:0.95;
    pointer-events:none;
}

.command-center-dashboard::after{
    content:"";
    position:absolute;
    right:-80px;
    top:-90px;
    width:260px;
    height:260px;
    z-index:0;

    background:radial-gradient(
        circle,
        rgba(96,165,250,0.28),
        rgba(96,165,250,0.12) 35%,
        transparent 70%
    );

    pointer-events:none;
}

.command-center-dashboard > *{
    position:relative;
    z-index:2;
}

.dashboard-chart-card{
    margin:20px 0 22px 0;
    padding:22px;

    border-radius:24px;
    border:1px solid rgba(191,219,254,0.75);

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.92),
            rgba(239,246,255,0.78)
        );

    box-shadow:
        0 18px 38px rgba(15,23,42,0.10),
        inset 0 1px 0 rgba(255,255,255,0.85);

    position:relative;
    overflow:hidden;
}

.dashboard-chart-card::before{
    content:"";
    position:absolute;
    left:24px;
    right:24px;
    top:0;
    height:4px;

    background:linear-gradient(
        90deg,
        transparent,
        #2563eb,
        #7c3aed,
        #38bdf8,
        transparent
    );

    border-radius:999px;
}

.dashboard-chart-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:26px;
    align-items:center;
    margin-top:22px;
}

.dashboard-chart-canvas-wrap{
    width:260px;
    height:260px;
    position:relative;
}

.dashboard-chart-canvas-wrap canvas{
    width:260px;
    height:260px;
    display:block;
}

.dashboard-chart-center{
    position:absolute;
    inset:0;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    pointer-events:none;
}

.dashboard-chart-center strong{
    font-size:38px;
    line-height:1;
    color:#0f172a;
    letter-spacing:-0.06em;
}

.dashboard-chart-center span{
    margin-top:6px;
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:0.06em;
    color:#64748b;
}

.dashboard-chart-legend{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.dashboard-chart-legend-row{
    display:flex;
    align-items:center;
    gap:10px;

    padding:14px 16px;

    border-radius:18px;
    background:rgba(255,255,255,0.72);
    border:1px solid rgba(226,232,240,0.9);

    box-shadow:0 8px 18px rgba(15,23,42,0.05);

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
}

.dashboard-chart-legend-row:hover{
    transform:translateY(-2px);
    background:white;
    box-shadow:0 14px 26px rgba(15,23,42,0.10);
}

.dashboard-chart-legend-row span:nth-child(2){
    flex:1;
    font-size:14px;
    font-weight:800;
    color:#334155;
}

.dashboard-chart-legend-row strong{
    font-size:22px;
    color:#0f172a;
}

.dashboard-chart-dot{
    width:12px;
    height:12px;
    border-radius:999px;
    box-shadow:0 0 0 4px rgba(226,232,240,0.75);
}

.dashboard-chart-dot.offer{
    background:#f59e0b;
}

.dashboard-chart-dot.realization{
    background:#2563eb;
}

.dashboard-chart-dot.done{
    background:#16a34a;
}

.dashboard-chart-dot.lost{
    background:#dc2626;
}

@media(max-width:1100px){
    .dashboard-chart-layout{
        grid-template-columns:1fr;
    }

    .dashboard-chart-canvas-wrap{
        margin:auto;
    }

    .dashboard-chart-legend{
        grid-template-columns:1fr;
    }
}

.dashboard-top-layout{
    display:grid;
    grid-template-columns:minmax(420px, 0.9fr) minmax(520px, 1.1fr);
    gap:22px;
    align-items:stretch;
    margin-bottom:28px;
}

.dashboard-top-cards{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.dashboard-top-cards .dashboard-card{
    min-height:150px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.dashboard-top-layout .dashboard-chart-card{
    margin:0;
    height:100%;
    box-sizing:border-box;
}

.dashboard-top-layout .dashboard-chart-layout{
    grid-template-columns:240px 1fr;
    gap:22px;
    margin-top:18px;
}

.dashboard-top-layout .dashboard-chart-canvas-wrap{
    width:230px;
    height:230px;
}

.dashboard-top-layout .dashboard-chart-canvas-wrap canvas{
    width:230px;
    height:230px;
}

.dashboard-top-layout .dashboard-chart-center strong{
    font-size:34px;
}

.dashboard-top-layout .dashboard-chart-legend{
    grid-template-columns:1fr;
    gap:10px;
}

.dashboard-top-layout .dashboard-chart-legend-row{
    padding:12px 14px;
}

@media(max-width:1250px){
    .dashboard-top-layout{
        grid-template-columns:1fr;
    }

    .dashboard-top-layout .dashboard-chart-layout{
        grid-template-columns:260px 1fr;
    }

    .dashboard-top-layout .dashboard-chart-canvas-wrap{
        width:260px;
        height:260px;
    }

    .dashboard-top-layout .dashboard-chart-canvas-wrap canvas{
        width:260px;
        height:260px;
    }
}

@media(max-width:760px){
    .dashboard-top-cards{
        grid-template-columns:1fr;
    }

    .dashboard-top-layout .dashboard-chart-layout{
        grid-template-columns:1fr;
    }

    .dashboard-top-layout .dashboard-chart-canvas-wrap{
        margin:auto;
    }

    .dashboard-top-layout .dashboard-chart-legend{
        grid-template-columns:1fr;
    }
}

.dashboard-top-layout{
    display:grid !important;
    grid-template-columns:minmax(520px, 0.9fr) minmax(620px, 1.1fr) !important;
    gap:24px;
    align-items:start;
    margin-bottom:28px;
}

.dashboard-top-cards{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:20px;
    align-items:start;
}

.dashboard-top-cards .dashboard-card{
    min-height:135px;
    padding:24px 24px 22px 24px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

.dashboard-top-cards .dashboard-card h3{
    margin:0 0 34px 0;
}

.dashboard-top-cards .dashboard-card p{
    margin:0;
    font-size:40px !important;
    line-height:1;
    font-weight:700;
    letter-spacing:-0.035em;
}

.dashboard-top-layout .dashboard-chart-card{
    margin:0 !important;
    min-height:0;
    height:auto;
    padding:22px;
    box-sizing:border-box;
}

.dashboard-top-layout .dashboard-chart-layout{
    display:grid;
    grid-template-columns:230px 1fr;
    gap:24px;
    align-items:center;
    margin-top:18px;
}

.dashboard-top-layout .dashboard-chart-canvas-wrap{
    width:230px;
    height:230px;
}

.dashboard-top-layout .dashboard-chart-canvas-wrap canvas{
    width:230px;
    height:230px;
}

.dashboard-top-layout .dashboard-chart-center strong{
    font-size:32px;
}

.dashboard-top-layout .dashboard-chart-legend{
    grid-template-columns:1fr;
    gap:10px;
}

.dashboard-top-layout .dashboard-chart-legend-row{
    padding:11px 14px;
}

.dashboard-top-cards .dashboard-card{
    min-height:118px;
    padding:22px 24px 20px 24px;
}

.dashboard-top-cards .dashboard-card h3{
    margin:0 0 28px 0;
}

.dashboard-clickable-row{
    cursor:pointer;
}

.dashboard-clickable-row:hover td{
    color:#1d4ed8;
}

.dashboard-clickable-row{
    cursor:pointer;
}

.dashboard-clickable-row:hover td{
    color:#1d4ed8;
}

.dashboard-chart-legend-clickable{
    cursor:pointer;
}

.dashboard-chart-legend-clickable:hover{
    transform:translateY(-2px) scale(1.01);
    box-shadow:0 14px 28px rgba(15,23,42,0.12);
}

.dashboard-chart-legend-clickable:hover span:nth-child(2){
    color:#1d4ed8;
}

.unsaved-changes-box{
    width:460px;
    text-align:left;
}

.unsaved-changes-box h2{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 12px 0;
    color:#0f172a;
}

.unsaved-changes-box h2 i{
    color:#f59e0b;
}

.unsaved-changes-box p{
    margin:0 0 20px 0;
    color:#475569;
    line-height:1.5;
}

.unsaved-changes-buttons{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.unsaved-changes-buttons button{
    width:100%;
    border:none;
    border-radius:12px;
    padding:13px 15px;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

#unsaved-save-button{
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
}

#unsaved-return-button{
    background:#e2e8f0;
    color:#334155;
}

#unsaved-close-button{
    background:linear-gradient(135deg, #dc2626, #b91c1c);
    color:white;
}

#unsaved-changes-modal{
    z-index:999999 !important;
}

#unsaved-changes-modal .modal-box{
    z-index:1000000 !important;
    position:relative;
}

.project-scopes-summary{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:16px;
    margin:16px 0 22px 0;
}

.project-scopes-summary .card{
    padding:18px;
}

.project-scopes-summary .card h3{
    margin:0 0 8px 0;
    font-size:13px;
    color:#64748b;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.project-scopes-summary .card p{
    margin:0;
    font-size:26px;
    font-weight:800;
    color:#0f172a;
}

.project-scope-modal-box{
    width:720px;
    max-width:94vw;
}

.project-scope-dates-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.project-scope-dates-row input{
    width:100%;
    box-sizing:border-box;
}

.project-scope-checkbox-row{
    display:flex !important;
    align-items:center;
    gap:10px;
    padding:12px 14px;
    border-radius:12px;
    background:#f8fafc;
    color:#334155 !important;
    font-weight:800;
    cursor:pointer;
}

.project-scope-checkbox-row input{
    width:auto !important;
}

@media(max-width:1100px){
    .project-scopes-summary{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:700px){
    .project-scopes-summary{
        grid-template-columns:1fr;
    }

    .project-scope-dates-row{
        grid-template-columns:1fr;
    }
}

.offer-revisions-panel{
    margin-top:24px;
    padding:18px;
    border-radius:18px;
    background:linear-gradient(135deg, rgba(248,250,252,0.96), rgba(239,246,255,0.86));
    border:1px solid rgba(191,219,254,0.85);
    box-shadow:
        0 10px 24px rgba(15,23,42,0.06),
        inset 0 1px 0 rgba(255,255,255,0.8);
}

.offer-revisions-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-bottom:14px;
}

.offer-revisions-header h3{
    margin:0;
    color:#0f172a;
    display:flex;
    align-items:center;
    gap:8px;
}

.offer-revisions-header p{
    margin:5px 0 0 0;
    color:#64748b;
    font-size:13px;
}

.offer-revisions-header button:disabled{
    opacity:0.55;
    cursor:not-allowed;
    transform:none !important;
    box-shadow:none !important;
}

.details-offer-revisions-panel{
    margin-top:28px;
}

.details-offer-revisions-panel table{
    margin-top:14px;
}

.field-hint{
    display:block;
    margin:-4px 0 8px 0;
    font-size:12px;
    line-height:1.4;
    color:#64748b;
}

/* Ikonki akcji tylko w zakładce Projekty */

.project-actions-cell{
    white-space:nowrap;
}

.project-actions-cell .project-action-button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    font-size:15px;
    line-height:1;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.project-actions-cell .project-action-button i{
    margin-right:0;
}

.project-actions-cell .project-action-button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

.project-actions-cell .project-action-delete{
    background:linear-gradient(135deg, #dc2626, #991b1b) !important;
}

.project-actions-cell .project-action-delete i{
    font-size:17px;
}

/* Węższa kolumna Akcje w tabeli Projekty */

#projects table th:last-child,
#projects table td:last-child{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

#projects .project-actions-cell{
    width:1%;
    min-width:138px;
    max-width:138px;
    padding-left:10px;
    padding-right:10px;
}

/* =========================================================
   CONNECTOR UX PROCESS LAYER
   Start / Sprzedaż / Projekty / Realizacja / Finanse
   ========================================================= */

.view-lead{
    margin-top:-12px;
    margin-bottom:22px;
    color:#64748b;
    font-size:15px;
    line-height:1.5;
}

/* MENU PROCESOWE */

.process-submenu{
    margin-left:0;
    padding-left:10px;
    border-left:1px solid rgba(148,163,184,0.35);
}

.process-submenu button{
    width:100%;
    margin-bottom:6px;
    background:rgba(51,65,85,0.68) !important;
    font-size:13px;
    padding:10px 12px !important;
}

.process-submenu button:hover{
    background:rgba(71,85,105,0.92) !important;
}

.sidebar.collapsed .process-submenu{
    display:none !important;
}

/* START / SZYBKIE AKCJE */

.process-quick-actions{
    display:grid;
    grid-template-columns:repeat(4, minmax(160px, 1fr));
    gap:14px;
    margin-bottom:24px;
}

.process-quick-actions button{
    min-height:84px;
    padding:16px !important;
    border:none;
    border-radius:18px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    cursor:pointer;
    font-weight:900;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:5px;
    box-shadow:0 10px 24px rgba(37,99,235,0.22);
}

.process-quick-actions button i{
    font-size:20px;
    margin-right:0;
}

.process-quick-actions button small{
    display:block;
    color:#dbeafe;
    font-weight:700;
    font-size:12px;
}

.process-quick-actions button:hover{
    transform:translateY(-2px);
    box-shadow:0 16px 32px rgba(37,99,235,0.28);
}

/* PROJEKTY — TABELA OPERACYJNA */

#projects .topbar{
    align-items:flex-start;
    gap:20px;
}

#projects .topbar > div:first-child{
    flex:1;
}

#projects .filters{
    background:white;
    border:1px solid #e2e8f0;
    border-radius:18px;
    padding:12px;
    box-shadow:0 6px 16px rgba(15,23,42,0.05);
}

#projects .filters input,
#projects .filters select{
    min-height:42px;
    background:#f8fafc;
    border:1px solid #cbd5e1;
    border-radius:12px;
}

#projects table tbody tr{
    cursor:pointer;
}

#projects table tbody tr:hover{
    background:#eff6ff;
}

#projects table tbody tr:hover td:first-child{
    font-weight:900;
    color:#1d4ed8;
}

/* WĄSKA KOLUMNA AKCJI W PROJEKTACH */

#projects table th:last-child,
#projects table td:last-child{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

#projects .project-actions-cell{
    width:1%;
    min-width:138px;
    max-width:138px;
    padding-left:10px;
    padding-right:10px;
}

.project-actions-cell{
    white-space:nowrap;
}

.project-actions-cell .project-action-button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    font-size:15px;
    line-height:1;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.project-actions-cell .project-action-button i{
    margin-right:0;
}

.project-actions-cell .project-action-button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

.project-actions-cell .project-action-delete{
    background:linear-gradient(135deg, #dc2626, #991b1b) !important;
}

.project-actions-cell .project-action-delete i{
    font-size:17px;
}

/* SZCZEGÓŁY PROJEKTU — PROCES */

.project-details-modal-box{
    width:1500px;
    max-width:98vw;
}

.project-process-tabs{
    gap:5px;
    overflow-x:auto;
    padding-bottom:0;
}

.project-process-tabs button{
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
    font-size:13px;
}

.project-process-tabs button i{
    margin-right:0;
}

.project-summary-hero{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    padding:24px;
    border-radius:24px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.22), transparent 38%),
        linear-gradient(135deg, #0f172a, #1e293b);
    color:white;
    margin-bottom:18px;
    box-shadow:0 18px 40px rgba(15,23,42,0.22);
}

.project-summary-hero h2{
    margin:8px 0;
    color:white;
    font-size:26px;
}

.project-summary-hero p{
    margin:0;
    color:#cbd5e1;
    line-height:1.5;
}

.project-summary-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 11px;
    border-radius:999px;
    background:rgba(255,255,255,0.12);
    color:#dbeafe;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.05em;
}

.project-summary-status{
    min-width:160px;
    display:flex;
    justify-content:flex-end;
}


.project-process-step span{
    width:14px;
    height:14px;
    border-radius:999px;
    background:#cbd5e1;
    box-shadow:0 0 0 5px #f1f5f9;
    flex-shrink:0;
}

.project-process-step strong{
    color:#475569;
    font-size:13px;
}

.project-process-step.active{
    background:linear-gradient(135deg, #eff6ff, #eef2ff);
    border-color:#93c5fd;
}

.project-process-step.active span{
    background:#2563eb;
    box-shadow:0 0 0 5px rgba(37,99,235,0.14);
}

.project-process-step.active strong{
    color:#1d4ed8;
}

.project-context-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:18px 0;
    padding:14px;
    border-radius:20px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}

.project-context-actions button{
    border:none;
    border-radius:14px;
    padding:12px 14px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.project-context-actions button i{
    margin-right:0;
}

.project-context-actions button:hover{
    transform:translateY(-1px);
    box-shadow:0 8px 18px rgba(37,99,235,0.22);
}

.project-summary-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:16px;
}

@media (max-width: 1100px){

    .project-summary-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px){

    .project-summary-grid{
        grid-template-columns:1fr;
    }

}

.project-summary-card{
    min-height:142px;
    padding:20px;
    border:none;
    border-radius:22px;
    background:white;
    color:#0f172a;
    text-align:left;
    cursor:pointer;
    box-shadow:
        0 8px 22px rgba(15,23,42,0.07),
        0 2px 6px rgba(15,23,42,0.04);
    border:1px solid #e2e8f0;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:12px;
}

.project-summary-card:hover{
    transform:translateY(-3px);
    box-shadow:
        0 16px 34px rgba(15,23,42,0.12),
        0 4px 10px rgba(15,23,42,0.06);
    border-color:#bfdbfe;
}

.project-summary-card span{
    display:flex;
    align-items:center;
    gap:10px;
    color:#475569;
    font-size:13px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.project-summary-card span i{
    width:34px;
    height:34px;
    border-radius:12px;
    background:#eff6ff;
    color:#2563eb;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:0;
}

.project-summary-card strong{
    display:block;
    font-size:22px;
    color:#0f172a;
}

.project-summary-card small{
    display:block;
    color:#64748b;
    font-size:13px;
    line-height:1.4;
}

#details-tab-summary .details-notes,
#details-tab-general .details-notes{
    border-radius:16px;
}

/* CZYTELNY PODGLĄD, MNIEJ FORMULARZOWY WYGLĄD SZCZEGÓŁÓW */

#project-details-modal .details-tab-content{
    padding-top:8px;
}

#project-details-modal .details-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:16px;
}

#project-details-modal .details-grid > div{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:14px;
}

#project-details-modal .details-grid label{
    margin:0 0 8px 0;
}

#project-details-modal .details-grid p{
    border-bottom:none;
    padding-bottom:0;
}

/* RESPONSYWNOŚĆ */

@media(max-width:1100px){

    .process-quick-actions{
        grid-template-columns:repeat(2, 1fr);
    }

    .project-summary-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .project-process-bar{
        grid-template-columns:1fr;
    }

    #project-details-modal .details-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:700px){

    .process-quick-actions,
    .project-summary-grid{
        grid-template-columns:1fr;
    }

    .project-summary-hero{
        flex-direction:column;
    }

    .project-summary-status{
        justify-content:flex-start;
    }
}

/* =========================================================
   POPRAWKI UX PO TESTACH — START / PROJEKTY / SZCZEGÓŁY
   ========================================================= */

/* 1. Start — więcej kafli, równe ułożenie */

/* CONNECTOR_STAGE_11_7_6_START_CLEANUP_REFRESH_V1 */
.process-quick-actions{
    grid-template-columns:repeat(4, minmax(160px, 1fr)) !important;
}

.process-quick-actions button,
.process-quick-actions button *,
.process-quick-actions button small{
    color:white !important;
}

.process-quick-actions button small{
    opacity:0.86;
}

/* 2. Szczegóły projektu — niebieskie przyciski mają biały tekst */

.project-context-actions button,
.project-context-actions button *,
.project-context-actions button i{
    color:white !important;
}

.project-context-actions button{
    border-radius:22px !important;
}

/* 3. Szczegóły projektu — 6 kafelków w tym samym stylu co górna belka */

.project-summary-card{
    border-radius:24px !important;
    overflow:hidden;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.16), transparent 38%),
        linear-gradient(135deg, #ffffff, #f8fafc) !important;
    border:1px solid #dbeafe !important;
}

.project-summary-card:hover{
    border-color:#93c5fd !important;
}

.project-summary-card span{
    color:#334155 !important;
}

.project-summary-card strong{
    color:#0f172a !important;
}

.project-summary-card small{
    color:#475569 !important;
}

.project-summary-card span i{
    border-radius:16px !important;
}

/* 4. Zakładki w Szczegółach — bez mini-scrolla */

.project-process-tabs{
    min-height:auto !important;
    height:auto !important;
    overflow:visible !important;
    flex-wrap:wrap !important;
    align-items:flex-end !important;
    padding-bottom:0 !important;
    row-gap:6px !important;
}

.project-process-tabs button{
    min-height:44px !important;
    height:auto !important;
    padding:12px 14px !important;
    line-height:1.2 !important;
    overflow:visible !important;
}

/* 5. Projekty — wyszukiwarka i filtry tej samej wysokości */

#projects .topbar{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    align-items:end !important;
    gap:16px !important;
}

#projects .topbar > div:first-child{
    grid-column:1 / -1;
}

#projects .filters{
    grid-column:1;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    min-height:54px !important;
    box-sizing:border-box !important;
}

#projects .filters input,
#projects .filters select{
    height:42px !important;
    min-height:42px !important;
    max-height:42px !important;
    padding:0 12px !important;
    box-sizing:border-box !important;
    line-height:42px !important;
    margin:0 !important;
}

#projects .topbar > button{
    grid-column:2;
    height:54px !important;
    min-height:54px !important;
    align-self:stretch !important;
    white-space:nowrap !important;
    border-radius:16px !important;
    font-weight:900 !important;
}

/* 6. Responsywność po dodaniu większej liczby kafli */

@media(max-width:1300px){
    .process-quick-actions{
        grid-template-columns:repeat(2, minmax(160px, 1fr)) !important;
    }
}

@media(max-width:850px){
    .process-quick-actions{
        grid-template-columns:1fr 1fr !important;
    }

    #projects .topbar{
        grid-template-columns:1fr !important;
    }

    #projects .topbar > button{
        grid-column:1 !important;
    }

    #projects .filters{
        flex-direction:column !important;
        align-items:stretch !important;
    }

    #projects .filters input,
    #projects .filters select{
        width:100% !important;
    }
}

@media(max-width:560px){
    .process-quick-actions{
        grid-template-columns:1fr !important;
    }
}

/* =========================================================
   POPRAWKA UKŁADU WIDOKU PROJEKTY
   ========================================================= */

#projects .projects-topbar{
    display:flex !important;
    justify-content:space-between !important;
    align-items:flex-start !important;
    gap:20px !important;
    margin-bottom:14px !important;
}

#projects .projects-title-block{
    flex:1;
}

#projects .projects-title-block h1{
    margin-bottom:6px;
}

#projects .projects-add-button{
    height:46px !important;
    min-height:46px !important;
    padding:0 18px !important;
    border:none;
    border-radius:16px !important;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
    margin-top:2px;
}

#projects .projects-add-button i{
    margin-right:0;
}

#projects .projects-filter-bar{
    display:flex;
    justify-content:center;
    margin-bottom:18px;
}

#projects .projects-filter-bar .filters{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:10px !important;
    width:auto !important;
    max-width:100%;
    margin:0 auto;
}

#projects .projects-filter-bar .filters input,
#projects .projects-filter-bar .filters select{
    height:42px !important;
    min-height:42px !important;
    max-height:42px !important;
    padding:0 12px !important;
    box-sizing:border-box !important;
    margin:0 !important;
}

@media(max-width:900px){

    #projects .projects-topbar{
        flex-direction:column;
        align-items:stretch !important;
    }

    #projects .projects-add-button{
        width:100%;
    }

    #projects .projects-filter-bar .filters{
        width:100% !important;
        flex-direction:column !important;
        align-items:stretch !important;
    }

    #projects .projects-filter-bar .filters input,
    #projects .projects-filter-bar .filters select{
        width:100% !important;
    }
}

/* Szczegóły projektu nad harmonogramem */

#project-details-modal{
    z-index:100200 !important;
}

#project-details-modal .modal-box{
    z-index:100201 !important;
}

/* =========================================================
   SZCZEGÓŁY PROJEKTU — FINANSE I REKLAMACJE
   ========================================================= */

.project-linked-section-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;

    padding:20px;
    margin-bottom:16px;

    border-radius:24px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.16), transparent 35%),
        linear-gradient(135deg, #ffffff, #f8fafc);

    border:1px solid #dbeafe;
    box-shadow:0 8px 22px rgba(15,23,42,0.06);
}

.project-linked-section-header h2{
    margin:0 0 6px 0;
    display:flex;
    align-items:center;
    gap:10px;
}

.project-linked-section-header h2 i{
    color:#2563eb;
    margin-right:0;
}

.project-linked-section-header p{
    margin:0;
    color:#64748b;
    line-height:1.5;
}

.project-linked-section-header button{
    border:none;
    border-radius:16px;
    padding:12px 16px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    gap:8px;

    white-space:nowrap;
}

.project-linked-section-header button i{
    margin-right:0;
}

.project-linked-section-header button,
.project-linked-section-header button *{
    color:white !important;
}

.project-linked-summary-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin-bottom:16px;
}

.project-linked-summary-card{
    padding:18px;
    border-radius:22px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 6px 16px rgba(15,23,42,0.05);
}

.project-linked-summary-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.project-linked-summary-card strong{
    display:block;
    color:#0f172a;
    font-size:24px;
}

.project-linked-summary-card.success{
    background:linear-gradient(135deg, #f0fdf4, #ffffff);
    border-color:#bbf7d0;
}

.project-linked-summary-card.warning{
    background:linear-gradient(135deg, #fffbeb, #ffffff);
    border-color:#fde68a;
}

.project-linked-summary-card.danger{
    background:linear-gradient(135deg, #fef2f2, #ffffff);
    border-color:#fecaca;
}

.project-linked-actions{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.project-linked-actions button{
    width:36px;
    height:36px;
    padding:0 !important;
    margin-right:5px;

    border:none;
    border-radius:10px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.project-linked-actions button i{
    margin-right:0;
}

.project-linked-actions button.success{
    background:linear-gradient(135deg, #16a34a, #15803d) !important;
}

.project-linked-actions button.danger{
    background:linear-gradient(135deg, #dc2626, #991b1b) !important;
}

.project-linked-actions button:hover{
    transform:translateY(-1px);
    box-shadow:0 5px 12px rgba(15,23,42,0.18);
}

@media(max-width:900px){

    .project-linked-section-header{
        flex-direction:column;
    }

    .project-linked-section-header button{
        width:100%;
        justify-content:center;
    }

    .project-linked-summary-grid{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   MODALE OTWIERANE ZE SZCZEGÓŁÓW PROJEKTU — ZAWSZE NA WIERZCHU
   ========================================================= */

/* Szczegóły projektu są głównym modalem */
#project-details-modal{
    z-index:100200 !important;
}

#project-details-modal .modal-box{
    z-index:100201 !important;
}

/* Faktura otwierana ze Szczegółów projektu */
#invoice-modal{
    z-index:100300 !important;
}

#invoice-modal .modal-box{
    z-index:100301 !important;
}

/* Reklamacja otwierana ze Szczegółów projektu */
#complaint-modal{
    z-index:100310 !important;
}

#complaint-modal .modal-box{
    z-index:100311 !important;
}

/* Pliki reklamacji, jeśli otwierasz je z reklamacji */
#complaint-file-modal{
    z-index:100320 !important;
}

#complaint-file-modal .modal-box{
    z-index:100321 !important;
}

/* Szczegóły klienta / kontaktu, gdyby były otwierane z projektu */
#client-details-modal,
#client-modal,
#client-contact-modal{
    z-index:100330 !important;
}

#client-details-modal .modal-box,
#client-modal .modal-box,
#client-contact-modal .modal-box{
    z-index:100331 !important;
}

/* Potwierdzenia usuń / OK / anuluj mają być najwyżej */
#confirm-modal{
    z-index:100900 !important;
}

#confirm-modal .modal-box{
    z-index:100901 !important;
}

/* =========================================================
   AWARYJNE WARSTWY MODALI — MODAL Z MODALA
   ========================================================= */

#project-details-modal{
    z-index:100200 !important;
}

#invoice-modal,
#complaint-modal,
#complaint-details-modal,
#complaint-file-modal{
    z-index:100800 !important;
}

#invoice-modal .modal-box,
#complaint-modal .modal-box,
#complaint-details-modal .modal-box,
#complaint-file-modal .modal-box{
    z-index:100801 !important;
}

#confirm-modal{
    z-index:100900 !important;
}

#confirm-modal .modal-box{
    z-index:100901 !important;
}

/* =========================================================
   PODSUMOWANIE PROJEKTU — 8 KAFLI
   ========================================================= */



.project-summary-card{
    min-height:150px;
}

@media(max-width:1300px){
    .project-summary-grid{
        grid-template-columns:repeat(2, minmax(220px, 1fr)) !important;
    }
}

@media(max-width:700px){
    .project-summary-grid{
        grid-template-columns:1fr !important;
    }
}

/* =========================================================
   WIDOK SPRZEDAŻ
   ========================================================= */

.sales-view-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:18px;
}

.sales-view-header h1{
    margin-bottom:6px;
}

.sales-main-action{
    height:46px;
    min-height:46px;
    padding:0 18px;
    border:none;
    border-radius:16px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
}

.sales-main-action,
.sales-main-action *{
    color:white !important;
}

.sales-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(180px, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.sales-summary-card{
    padding:18px;
    border-radius:24px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 8px 22px rgba(15,23,42,0.06);
}

.sales-summary-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.sales-summary-card strong{
    display:block;
    font-size:30px;
    color:#0f172a;
    line-height:1;
    margin-bottom:8px;
}

.sales-summary-card small{
    color:#64748b;
}

.sales-summary-card.active{
    background:linear-gradient(135deg, #eff6ff, #ffffff);
    border-color:#bfdbfe;
}

.sales-summary-card.warning{
    background:linear-gradient(135deg, #fffbeb, #ffffff);
    border-color:#fde68a;
}

.sales-summary-card.danger{
    background:linear-gradient(135deg, #fef2f2, #ffffff);
    border-color:#fecaca;
}

.sales-summary-card.lost{
    background:linear-gradient(135deg, #f8fafc, #ffffff);
    border-color:#cbd5e1;
}

.sales-filter-bar{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

.sales-filter-bar input,
.sales-filter-bar select{
    height:42px;
    min-height:42px;
    padding:0 12px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:white;
    box-sizing:border-box;
}

.sales-filter-bar input{
    min-width:320px;
}

.sales-table td{
    vertical-align:middle;
}

.sales-row-warning{
    background:#fffbeb;
}

.sales-row-danger{
    background:#fef2f2;
}

.sales-row-lost{
    background:#f8fafc;
    color:#475569;
}

.offer-validity-success{
    color:#15803d;
    font-weight:800;
}

.offer-validity-warning{
    color:#b45309;
    font-weight:900;
}

.offer-validity-danger{
    color:#dc2626;
    font-weight:900;
}

.offer-validity-neutral{
    color:#64748b;
    font-weight:800;
}

.sales-actions-cell{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.sales-actions-cell button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.sales-actions-cell button i{
    margin-right:0;
}

.sales-actions-cell button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

@media(max-width:1100px){

    .sales-summary-grid{
        grid-template-columns:repeat(2, minmax(180px, 1fr));
    }

    .sales-view-header{
        flex-direction:column;
    }

    .sales-main-action{
        width:100%;
    }

}

@media(max-width:700px){

    .sales-summary-grid{
        grid-template-columns:1fr;
    }

    .sales-filter-bar{
        flex-direction:column;
        align-items:stretch;
    }

    .sales-filter-bar input,
    .sales-filter-bar select{
        width:100%;
        min-width:0;
    }
}

/* =========================================================
   WIDOK REALIZACJA
   ========================================================= */

.realization-view-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:18px;
}

.realization-view-header h1{
    margin-bottom:6px;
}

.realization-main-action{
    height:46px;
    min-height:46px;
    padding:0 18px;
    border:none;
    border-radius:16px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
}

.realization-main-action,
.realization-main-action *{
    color:white !important;
}

.realization-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(180px, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.realization-summary-card{
    padding:18px;
    border-radius:24px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 8px 22px rgba(15,23,42,0.06);
    cursor:pointer;
}

.realization-summary-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.realization-summary-card strong{
    display:block;
    font-size:30px;
    color:#0f172a;
    line-height:1;
    margin-bottom:8px;
}

.realization-summary-card small{
    color:#64748b;
}

.realization-summary-card.active{
    background:linear-gradient(135deg, #eff6ff, #ffffff);
    border-color:#bfdbfe;
}

.realization-summary-card.warning{
    background:linear-gradient(135deg, #fffbeb, #ffffff);
    border-color:#fde68a;
}

.realization-summary-card.danger{
    background:linear-gradient(135deg, #fef2f2, #ffffff);
    border-color:#fecaca;
}

.realization-summary-card.paused{
    background:linear-gradient(135deg, #f8fafc, #ffffff);
    border-color:#cbd5e1;
}

.realization-filter-bar{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

.realization-filter-bar input,
.realization-filter-bar select{
    height:42px;
    min-height:42px;
    padding:0 12px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:white;
    box-sizing:border-box;
}

.realization-filter-bar input{
    min-width:320px;
}

.realization-table td{
    vertical-align:middle;
}

.realization-row-warning{
    background:#fffbeb;
}

.realization-row-danger{
    background:#fef2f2;
}

.realization-row-paused{
    background:#f8fafc;
    color:#475569;
}

.realization-state-success{
    color:#15803d;
    font-weight:900;
}

.realization-state-warning{
    color:#b45309;
    font-weight:900;
}

.realization-state-danger{
    color:#dc2626;
    font-weight:900;
}

.realization-state-neutral{
    color:#64748b;
    font-weight:900;
}

.realization-state-paused{
    color:#475569;
    font-weight:900;
}

.realization-actions-cell{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.realization-actions-cell button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.realization-actions-cell button i{
    margin-right:0;
}

.realization-actions-cell button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

@media(max-width:1100px){

    .realization-summary-grid{
        grid-template-columns:repeat(2, minmax(180px, 1fr));
    }

    .realization-view-header{
        flex-direction:column;
    }

    .realization-main-action{
        width:100%;
    }

}

@media(max-width:700px){

    .realization-summary-grid{
        grid-template-columns:1fr;
    }

    .realization-filter-bar{
        flex-direction:column;
        align-items:stretch;
    }

    .realization-filter-bar input,
    .realization-filter-bar select{
        width:100%;
        min-width:0;
    }
}

/* =========================================================
   PODSUMOWANIE PROJEKTU — PODPOWIEDŹ STATUSU
   ========================================================= */

.project-summary-status-wrap{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:8px;
    max-width:360px;
}

.project-status-hint{
    display:flex;
    align-items:flex-start;
    gap:8px;

    padding:10px 12px;
    border-radius:16px;

    background:rgba(255,255,255,0.82);
    border:1px solid rgba(191,219,254,0.95);

    color:#334155;
    font-size:13px;
    font-weight:700;
    line-height:1.35;

    box-shadow:0 6px 16px rgba(15,23,42,0.07);
}

.project-status-hint i{
    color:#2563eb;
    margin-right:0;
    margin-top:2px;
}

.project-status-hint span{
    display:block;
    text-align:right;
}

@media(max-width:900px){

    .project-summary-status-wrap{
        align-items:flex-start;
        max-width:100%;
    }

    .project-status-hint span{
        text-align:left;
    }
}

/* =========================================================
   WIDOK FINANSE / PŁATNOŚCI
   ========================================================= */

.finance-view-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:18px;
}

.finance-view-header h1{
    margin-bottom:6px;
}

.finance-main-action{
    height:46px;
    min-height:46px;
    padding:0 18px;
    border:none;
    border-radius:16px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
}

.finance-main-action,
.finance-main-action *{
    color:white !important;
}

.finance-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(180px, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.finance-summary-card{
    padding:18px;
    border-radius:24px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 8px 22px rgba(15,23,42,0.06);
}

.finance-summary-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.finance-summary-card strong{
    display:block;
    font-size:30px;
    color:#0f172a;
    line-height:1;
    margin-bottom:8px;
}

.finance-summary-card small{
    color:#64748b;
}

.finance-summary-card.waiting{
    background:linear-gradient(135deg, #eff6ff, #ffffff);
    border-color:#bfdbfe;
}

.finance-summary-card.danger{
    background:linear-gradient(135deg, #fef2f2, #ffffff);
    border-color:#fecaca;
}

.finance-summary-card.success{
    background:linear-gradient(135deg, #f0fdf4, #ffffff);
    border-color:#bbf7d0;
}

.finance-summary-card.total{
    background:linear-gradient(135deg, #f8fafc, #ffffff);
    border-color:#cbd5e1;
}

.finance-filter-bar{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

.finance-filter-bar input,
.finance-filter-bar select{
    height:42px;
    min-height:42px;
    padding:0 12px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:white;
    box-sizing:border-box;
}

.finance-filter-bar input{
    min-width:340px;
}

.finance-table td{
    vertical-align:middle;
}

.finance-row-warning{
    background:#fffbeb;
}

.finance-row-danger{
    background:#fef2f2;
}

.finance-row-paid{
    background:#f0fdf4;
}

.finance-due-success{
    color:#15803d;
    font-weight:900;
}

.finance-due-warning{
    color:#b45309;
    font-weight:900;
}

.finance-due-danger{
    color:#dc2626;
    font-weight:900;
}

.finance-due-neutral{
    color:#64748b;
    font-weight:900;
}

.finance-actions-cell{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.finance-actions-cell button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.finance-actions-cell button i{
    margin-right:0;
}

.finance-actions-cell button.success{
    background:linear-gradient(135deg, #16a34a, #15803d) !important;
}

.finance-actions-cell button.danger{
    background:linear-gradient(135deg, #dc2626, #991b1b) !important;
}

.finance-actions-cell button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

@media(max-width:1100px){

    .finance-summary-grid{
        grid-template-columns:repeat(2, minmax(180px, 1fr));
    }

    .finance-view-header{
        flex-direction:column;
    }

    .finance-main-action{
        width:100%;
    }
}

@media(max-width:700px){

    .finance-summary-grid{
        grid-template-columns:1fr;
    }

    .finance-filter-bar{
        flex-direction:column;
        align-items:stretch;
    }

    .finance-filter-bar input,
    .finance-filter-bar select{
        width:100%;
        min-width:0;
    }
}

/* =========================================================
   WIDOK DO WYSTAWIENIA
   ========================================================= */

.invoice-view-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:18px;
}

.invoice-view-header h1{
    margin-bottom:6px;
}

.invoice-main-action{
    height:46px;
    min-height:46px;
    padding:0 18px;
    border:none;
    border-radius:16px;
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
}

.invoice-main-action,
.invoice-main-action *{
    color:white !important;
}

.invoice-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(180px, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.invoice-summary-card{
    padding:18px;
    border-radius:24px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 8px 22px rgba(15,23,42,0.06);
}

.invoice-summary-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:8px;
}

.invoice-summary-card strong{
    display:block;
    font-size:30px;
    color:#0f172a;
    line-height:1;
    margin-bottom:8px;
}

.invoice-summary-card small{
    color:#64748b;
}

.invoice-summary-card.waiting{
    background:linear-gradient(135deg, #eff6ff, #ffffff);
    border-color:#bfdbfe;
}

.invoice-summary-card.warning{
    background:linear-gradient(135deg, #fffbeb, #ffffff);
    border-color:#fde68a;
}

.invoice-summary-card.success{
    background:linear-gradient(135deg, #f0fdf4, #ffffff);
    border-color:#bbf7d0;
}

.invoice-summary-card.total{
    background:linear-gradient(135deg, #f8fafc, #ffffff);
    border-color:#cbd5e1;
}

.invoice-filter-bar{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

.invoice-filter-bar input,
.invoice-filter-bar select{
    height:42px;
    min-height:42px;
    padding:0 12px;
    border:1px solid #cbd5e1;
    border-radius:12px;
    background:white;
    box-sizing:border-box;
}

.invoice-filter-bar input{
    min-width:340px;
}

.invoice-table td{
    vertical-align:middle;
}

.invoice-row-warning{
    background:#fffbeb;
}

.invoice-row-success{
    background:#f0fdf4;
}

.invoice-missing-value{
    color:#b45309;
    font-weight:900;
}

.invoice-actions-cell{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.invoice-actions-cell button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.invoice-actions-cell button i{
    margin-right:0;
}

.invoice-actions-cell button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

@media(max-width:1100px){

    .invoice-summary-grid{
        grid-template-columns:repeat(2, minmax(180px, 1fr));
    }

    .invoice-view-header{
        flex-direction:column;
    }

    .invoice-main-action{
        width:100%;
    }
}

@media(max-width:700px){

    .invoice-summary-grid{
        grid-template-columns:1fr;
    }

    .invoice-filter-bar{
        flex-direction:column;
        align-items:stretch;
    }

    .invoice-filter-bar input,
    .invoice-filter-bar select{
        width:100%;
        min-width:0;
    }
}

/* =========================================================
   SZCZEGÓŁY KLIENTA — CENTRUM INFORMACJI
   ========================================================= */

#client-details-modal{
    z-index:100250 !important;
}

#client-details-modal .modal-box{
    z-index:100251 !important;
}

.client-command-hero{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;

    padding:22px;
    margin-bottom:16px;

    border-radius:26px;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,0.16), transparent 36%),
        linear-gradient(135deg, #ffffff, #f8fafc);

    border:1px solid #dbeafe;
    box-shadow:0 10px 26px rgba(15,23,42,0.07);
}

.client-command-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:7px 11px;
    margin-bottom:10px;

    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;

    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.client-command-kicker i{
    margin-right:0;
}

.client-command-hero h2{
    margin:0 0 6px 0;
    font-size:26px;
    color:#0f172a;
}

.client-command-hero p{
    margin:0;
    color:#64748b;
}

.client-command-hero button{
    height:44px;
    padding:0 16px;
    border:none;
    border-radius:16px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
}

.client-command-hero button,
.client-command-hero button *{
    color:white !important;
}

.client-command-summary-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(170px, 1fr));
    gap:14px;
    margin-bottom:16px;
}

.client-command-card{
    padding:18px;
    border-radius:22px;
    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 6px 16px rgba(15,23,42,0.05);
}

.client-command-card span{
    display:block;
    margin-bottom:8px;

    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.client-command-card strong{
    display:block;
    margin-bottom:7px;

    color:#0f172a;
    font-size:28px;
    line-height:1;
}

.client-command-card small{
    color:#64748b;
}

.client-command-card.active{
    background:linear-gradient(135deg, #eff6ff, #ffffff);
    border-color:#bfdbfe;
}

.client-command-card.finance{
    background:linear-gradient(135deg, #f0fdf4, #ffffff);
    border-color:#bbf7d0;
}

.client-command-card.warning{
    background:linear-gradient(135deg, #fffbeb, #ffffff);
    border-color:#fde68a;
}

.client-details-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:16px;
    border-bottom:1px solid #e2e8f0;
    padding-bottom:8px;
}

.client-details-tabs button{
    border:none;
    border-radius:14px 14px 0 0;

    padding:11px 14px;
    background:#e2e8f0;
    color:#334155;

    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    gap:8px;
}

.client-details-tabs button i{
    margin-right:0;
}

.client-details-tabs button.active-tab{
    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
}

.client-details-tabs button.active-tab *{
    color:white !important;
}

.client-tab-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;

    padding:16px;
    margin-bottom:14px;

    border-radius:22px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}

.client-tab-header h3{
    margin:0 0 5px 0;
    display:flex;
    align-items:center;
    gap:9px;
    color:#0f172a;
}

.client-tab-header h3 i{
    color:#2563eb;
    margin-right:0;
}

.client-tab-header p{
    margin:0;
    color:#64748b;
}

.client-tab-header button{
    border:none;
    border-radius:16px;
    padding:11px 15px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
}

.client-tab-header button,
.client-tab-header button *{
    color:white !important;
}

.client-overview-panels{
    display:grid;
    grid-template-columns:repeat(4, minmax(170px, 1fr));
    gap:12px;
    margin-top:16px;
}

.client-overview-panels button{
    min-height:86px;
    padding:14px;

    border:none;
    border-radius:20px;

    background:white;
    border:1px solid #e2e8f0;
    box-shadow:0 5px 15px rgba(15,23,42,0.06);

    cursor:pointer;

    display:flex;
    align-items:center;
    gap:12px;
    text-align:left;
}

.client-overview-panels button:hover{
    transform:translateY(-1px);
    border-color:#93c5fd;
    box-shadow:0 8px 20px rgba(37,99,235,0.14);
}

.client-overview-panels button i{
    width:40px;
    height:40px;
    min-width:40px;

    border-radius:15px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-right:0;
}

.client-overview-panels button span{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.client-overview-panels button strong{
    color:#0f172a;
}

.client-overview-panels button small{
    color:#64748b;
}

.client-mini-summary-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:12px;
    margin-bottom:14px;
}

.client-mini-summary-grid div{
    padding:16px;
    border-radius:20px;
    background:white;
    border:1px solid #e2e8f0;
}

.client-mini-summary-grid span{
    display:block;
    margin-bottom:7px;

    color:#64748b;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
}

.client-mini-summary-grid strong{
    color:#0f172a;
    font-size:22px;
}

.client-mini-summary-grid .danger{
    background:#fef2f2;
    border-color:#fecaca;
}

.client-mini-summary-grid .success{
    background:#f0fdf4;
    border-color:#bbf7d0;
}

.client-command-actions{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.client-command-actions button{
    width:36px;
    height:36px;
    padding:0 !important;
    margin-right:5px;

    border:none;
    border-radius:10px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.client-command-actions button i{
    margin-right:0;
}

.client-command-actions button:hover{
    transform:translateY(-1px);
    box-shadow:0 5px 12px rgba(15,23,42,0.18);
}

@media(max-width:1200px){

    .client-command-summary-grid,
    .client-overview-panels{
        grid-template-columns:repeat(2, minmax(180px, 1fr));
    }
}

@media(max-width:700px){

    .client-command-hero{
        flex-direction:column;
    }

    .client-command-hero button{
        width:100%;
        justify-content:center;
    }

    .client-command-summary-grid,
    .client-overview-panels,
    .client-mini-summary-grid{
        grid-template-columns:1fr;
    }

    .client-tab-header{
        flex-direction:column;
    }

    .client-tab-header button{
        width:100%;
        justify-content:center;
    }
}

/* =========================================================
   SZCZEGÓŁY KLIENTA — SZERSZE OKNO
   ========================================================= */

#client-details-modal .modal-box{
    width:1400px !important;
    max-width:96vw !important;
}

#client-details-modal .form-modal{
    width:1400px !important;
    max-width:96vw !important;
}

#client-details-modal table{
    width:100%;
}

#client-details-modal .client-tab-content{
    overflow-x:auto;
}

/* Na mniejszych ekranach modal nadal ma się mieścić */
@media(max-width:1500px){

    #client-details-modal .modal-box,
    #client-details-modal .form-modal{
        width:calc(100vw - 40px) !important;
        max-width:calc(100vw - 40px) !important;
    }
}

/* =========================================================
   SZCZEGÓŁY KLIENTA — MNIEJ ZAJĘTEGO MIEJSCA
   ========================================================= */

/* Ukrywamy górne kafle: Projekty / Aktywne / Finanse / Reklamacje */
#client-details-modal .client-command-summary-grid{
    display:none !important;
}

/* Mniejszy odstęp po dużym nagłówku klienta */
#client-details-modal .client-command-hero{
    margin-bottom:14px !important;
}

/* Zakładki bliżej nagłówka */
#client-details-modal .client-details-tabs{
    margin-top:0 !important;
}

/* =========================================================
   WARSTWY MODALI — PROJEKT I OKNA OTWIERANE Z PROJEKTU
   ========================================================= */

/* Okno klienta */
#client-details-modal{
    z-index:100250 !important;
}

#client-details-modal .modal-box{
    z-index:100251 !important;
}

/* Szczegóły projektu */
#project-details-modal{
    z-index:100700 !important;
}

#project-details-modal .modal-box{
    z-index:100701 !important;
}

/* Edycja projektu */
#project-modal{
    z-index:100710 !important;
}

#project-modal .modal-box{
    z-index:100711 !important;
}

/* Okna otwierane Z OKNA EDYTUJ PROJEKT — muszą być wyżej niż #project-modal */
#project-resource-modal,
#project-employee-modal,
#project-task-modal,
#project-scope-modal,
#project-file-modal{
    z-index:100720 !important;
}

#project-resource-modal .modal-box,
#project-employee-modal .modal-box,
#project-task-modal .modal-box,
#project-scope-modal .modal-box,
#project-file-modal .modal-box{
    z-index:100721 !important;
}

/* Dodatkowe okna zadań otwierane z okna zadania — jeszcze wyżej */
#project-task-employees-modal{
    z-index:100730 !important;
}

#project-task-employees-modal .modal-box{
    z-index:100731 !important;
}

#project-task-resources-modal{
    z-index:100740 !important;
}

#project-task-resources-modal .modal-box{
    z-index:100741 !important;
}

#project-task-dependencies-modal{
    z-index:100750 !important;
}

#project-task-dependencies-modal .modal-box{
    z-index:100751 !important;
}

/* Konflikty zasobów / zadań — wyżej niż zwykłe okna pomocnicze */
#resource-conflict-modal,
#task-conflict-modal{
    z-index:100760 !important;
}

#resource-conflict-modal .modal-box,
#task-conflict-modal .modal-box{
    z-index:100761 !important;
}

/* Faktura / reklamacja nadal wysoko */
#invoice-modal,
#complaint-modal,
#complaint-details-modal,
#complaint-file-modal{
    z-index:100800 !important;
}

#invoice-modal .modal-box,
#complaint-modal .modal-box,
#complaint-details-modal .modal-box,
#complaint-file-modal .modal-box{
    z-index:100801 !important;
}

/* Potwierdzenia zawsze na samej górze */
#confirm-modal{
    z-index:100900 !important;
}

#confirm-modal .modal-box{
    z-index:100901 !important;
}

/* =========================================================
   SZCZEGÓŁY KLIENTA — GŁÓWNE AKCJE
   ========================================================= */

.client-command-main-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    align-items:center;
    gap:10px;
}

.client-command-main-actions button{
    height:44px;
    padding:0 14px;

    border:none;
    border-radius:16px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    white-space:nowrap;
}

.client-command-main-actions button,
.client-command-main-actions button *{
    color:white !important;
}

.client-command-main-actions button i{
    margin-right:0;
}

.client-command-main-actions button:hover{
    transform:translateY(-1px);
    box-shadow:0 6px 14px rgba(15,23,42,0.18);
}

@media(max-width:900px){

    .client-command-main-actions{
        width:100%;
        justify-content:stretch;
    }

    .client-command-main-actions button{
        flex:1 1 100%;
    }
}

/* =========================================================
   PORZĄDKI UX — IKONY I STARE ELEMENTY
   ========================================================= */

#details-onedrive-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    border:none;
    border-radius:16px;

    padding:11px 16px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    font-weight:900;
    cursor:pointer;
}

#details-onedrive-button,
#details-onedrive-button *{
    color:white !important;
}

#details-onedrive-button i{
    margin-right:0;
}

#task-conflict-modal h2,
#resource-conflict-modal h2{
    display:flex;
    align-items:center;
    gap:10px;
}

#task-conflict-modal h2 i,
#resource-conflict-modal h2 i{
    color:#dc2626
}

/* =========================================================
   REKLAMACJE — AKCJE I KLIKALNY WIERSZ
   ========================================================= */

#complaints-table tr:hover{
    background:#eff6ff;
}

.complaints-actions-cell{
    width:1%;
    white-space:nowrap;
    text-align:center;
}

.complaints-actions-cell button{
    width:38px;
    height:38px;
    padding:0 !important;
    margin-right:6px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:10px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    cursor:pointer;
}

.complaints-actions-cell button i{
    margin-right:0;
}

.complaints-actions-cell button.danger{
    background:linear-gradient(135deg, #dc2626, #991b1b) !important;
}

.complaints-actions-cell button:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.18);
}

/* =========================================================
   SZCZEGÓŁY PROJEKTU — WORKFLOW ZE SZPICAMI
   ========================================================= */

.project-process-bar{
    display:flex !important;
    align-items:stretch !important;
    gap:0 !important;

    width:100%;
    margin:14px 0 16px 0 !important;

    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
    overflow:visible !important;
}

.project-process-step{
    position:relative;

    flex:1;
    min-width:0;

    height:56px !important;
    min-height:56px !important;

    padding:0 26px 0 24px !important;
    margin-right:10px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:11px !important;

    border:none !important;
    border-radius:16px 0 0 16px !important;

    background:linear-gradient(135deg, #ffffff, #f8fafc) !important;
    color:#475569 !important;

    box-shadow:0 6px 16px rgba(15,23,42,0.06) !important;

    overflow:visible !important;
    transform:none !important;
}

/* Szpic po prawej stronie etapu */
.project-process-step::after{
    content:"" !important;
    display:block !important;

    position:absolute;
    top:0;
    right:-22px;

    width:0;
    height:0;

    border-top:28px solid transparent;
    border-bottom:28px solid transparent;
    border-left:22px solid #f8fafc;

    z-index:4;
}

/* wycięcie po lewej, żeby etapy wyglądały jak połączony workflow */
.project-process-step:not(:first-child)::before{
    content:"" !important;
    display:block !important;

    position:absolute;
    top:0;
    left:0;

    width:0;
    height:0;

    border-top:28px solid transparent;
    border-bottom:28px solid transparent;
    border-left:22px solid white;

    z-index:5;
}

/* pierwszy i ostatni etap */
.project-process-step:first-child{
    border-radius:18px 0 0 18px !important;
}

.project-process-step:last-child{
    margin-right:0 !important;
    border-radius:16px 18px 18px 16px !important;
}

.project-process-step:last-child::after{
    display:none !important;
}

/* układ warstw, żeby szpice ładnie nachodziły */
.project-process-step:nth-child(1){
    z-index:10;
}

.project-process-step:nth-child(2){
    z-index:9;
}

.project-process-step:nth-child(3){
    z-index:8;
}

.project-process-step:nth-child(4){
    z-index:7;
}

.project-process-step:nth-child(5){
    z-index:6;
}

/* usuwamy stare elementy */
.project-process-step span,
.project-process-label,
.project-process-label small{
    display:none !important;
}

.project-process-number{
    position:relative;
    z-index:8;

    width:32px;
    height:32px;
    min-width:32px;

    border-radius:12px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#e2e8f0;
    color:#475569;

    font-weight:1000;
    font-size:14px;

    box-shadow:inset 0 0 0 1px rgba(255,255,255,0.7);
}

.project-process-step strong{
    position:relative;
    z-index:8;

    color:inherit !important;
    font-size:15px !important;
    font-weight:1000 !important;
    white-space:nowrap;
}

/* =========================
   ETAPY WYKONANE
   ========================= */

.project-process-step.done{
    background:linear-gradient(135deg, #dbeafe, #bfdbfe) !important;
    color:#1e40af !important;
}

.project-process-step.done::after{
    border-left-color:#bfdbfe !important;
}

.project-process-step.done .project-process-number{
    background:linear-gradient(135deg, #38bdf8, #2563eb);
    color:white;
}

/* =========================
   ETAP AKTYWNY
   ========================= */

.project-process-step.active{
    background:linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    color:white !important;

    box-shadow:
        0 8px 20px rgba(37,99,235,0.28),
        inset 0 -3px 0 rgba(15,23,42,0.15) !important;
}

.project-process-step.active::after{
    border-left-color:#1d4ed8 !important;
}

.project-process-step.active .project-process-number{
    background:white;
    color:#1d4ed8;
    box-shadow:0 0 0 4px rgba(255,255,255,0.16);
}

.project-process-step.active strong{
    color:white !important;
}

/* =========================
   ETAPY OCZEKUJĄCE
   ========================= */

.project-process-step.pending{
    background:linear-gradient(135deg, #ffffff, #f8fafc) !important;
    color:#475569 !important;
}

.project-process-step.pending::after{
    border-left-color:#f8fafc !important;
}

.project-process-step.pending .project-process-number{
    background:#e2e8f0;
    color:#64748b;
}

/* =========================
   STATUSY SPECJALNE
   ========================= */

.project-process-step.lost{
    background:linear-gradient(135deg, #64748b, #334155) !important;
    color:white !important;
}

.project-process-step.lost::after{
    border-left-color:#334155 !important;
}

.project-process-step.lost .project-process-number{
    background:white;
    color:#334155;
}

.project-process-step.paused{
    background:linear-gradient(135deg, #f59e0b, #d97706) !important;
    color:white !important;
}

.project-process-step.paused::after{
    border-left-color:#d97706 !important;
}

.project-process-step.paused .project-process-number{
    background:white;
    color:#b45309;
}

/* bez hovera */
.project-process-step:hover,
.project-process-step.active:hover{
    transform:none !important;
    filter:none !important;
}

/* Responsywność — na małych ekranach wracamy do kafli bez szpiców */
@media(max-width:1000px){

    .project-process-bar{
        display:grid !important;
        grid-template-columns:repeat(2, minmax(180px, 1fr)) !important;
        gap:10px !important;
    }

    .project-process-step{
        margin-right:0 !important;
        border-radius:16px !important;
        padding:0 16px !important;
    }

    .project-process-step::before,
    .project-process-step::after{
        display:none !important;
    }
}

@media(max-width:620px){

    .project-process-bar{
        grid-template-columns:1fr !important;
    }
}

/* =========================================================
   KLIENT — POBIERANIE DANYCH Z GUS
   ========================================================= */

.gus-nip-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}

.gus-nip-row input{
    width:100%;
}

#gus-fetch-button{
    height:42px;
    min-height:42px;
    padding:0 14px;

    border:none;
    border-radius:14px;

    background:linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;

    font-weight:900;
    cursor:pointer;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    white-space:nowrap;
}

#gus-fetch-button,
#gus-fetch-button *{
    color:white !important;
}

#gus-fetch-button i{
    margin-right:0;
}

#gus-fetch-button:disabled{
    opacity:0.7;
    cursor:wait;
}

.gus-fetch-hint{
    margin-top:-6px;
    margin-bottom:8px;

    padding:9px 11px;
    border-radius:14px;

    background:#eff6ff;
    border:1px solid #bfdbfe;

    color:#1e40af;
    font-size:13px;
    font-weight:800;
}

@media(max-width:700px){

    .gus-nip-row{
        grid-template-columns:1fr;
    }

    #gus-fetch-button{
        width:100%;
    }
}

/* =========================
   FINANSE — GRUPOWANIE KAFELKÓW
   ========================= */

.finance-summary-grid-extended{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    align-items:stretch;
}

.finance-summary-group{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;

    padding:18px;
    border-radius:24px;

    background:
        radial-gradient(circle at top left, rgba(59,130,246,0.12), transparent 35%),
        rgba(255,255,255,0.82);

    border:1px solid rgba(191,219,254,0.85);

    box-shadow:
        0 12px 28px rgba(15,23,42,0.08),
        inset 0 1px 0 rgba(255,255,255,0.80);
}

.finance-summary-group-analysis{
    background:
        radial-gradient(circle at top left, rgba(22,163,74,0.12), transparent 35%),
        rgba(255,255,255,0.86);

    border-color:rgba(187,247,208,0.95);
}

.finance-summary-group-title{
    grid-column:1 / -1;

    display:flex;
    align-items:center;
    gap:9px;

    margin-bottom:2px;
    padding:10px 12px;

    border-radius:16px;

    font-size:13px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.05em;

    color:#334155;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}

.finance-summary-group-title i{
    color:#2563eb;
}

.finance-summary-group-analysis .finance-summary-group-title i{
    color:#16a34a;
}

.finance-summary-grid-extended .finance-summary-card{
    min-height:112px;
}

.finance-summary-grid-extended .finance-summary-card strong{
    font-size:24px;
    letter-spacing:-0.03em;
}

.finance-summary-grid-extended .finance-summary-card small{
    line-height:1.35;
}

@media(max-width:1200px){
    .finance-summary-grid-extended{
        grid-template-columns:1fr;
    }
}

@media(max-width:750px){
    .finance-summary-group{
        grid-template-columns:1fr;
    }
}

/* =========================
   POWIĄZANIE AKCJI ZE STATUSEM PROJEKTU
   ramka nie wychodzi poza ekran
   ========================= */

.project-context-actions-linked{
    --actions-left:50%;
    --actions-shift:-50%;
    --connector-left:50%;

    position:relative;
    left:var(--actions-left);
    transform:translateX(var(--actions-shift));

    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    flex-wrap:wrap;
    gap:10px;

    width:max-content;
    max-width:92%;

    margin:10px 0 14px 0 !important;

    padding:12px 16px !important;

    border:2px solid #2563eb !important;
    border-radius:18px !important;

    background:rgba(255,255,255,0.94) !important;

    box-shadow:
        0 10px 22px rgba(15,23,42,0.10),
        inset 0 1px 0 rgba(255,255,255,0.75);
}

.project-context-actions-linked::before{
    content:"";
    position:absolute;
    left:var(--connector-left);
    top:-18px;
    width:2px;
    height:18px;
    background:#2563eb;
    transform:translateX(-50%);
}

.project-context-actions-linked::after{
    content:"";
    position:absolute;
    left:var(--connector-left);
    top:-23px;
    width:12px;
    height:12px;
    border-radius:999px;
    background:#2563eb;
    transform:translateX(-50%);
    box-shadow:0 0 0 4px rgba(37,99,235,0.14);
}

.project-context-actions-linked button{
    margin:0 !important;
    white-space:nowrap;
}

/* Zapytanie — ramka przyklejona do lewej, ale kreska celuje w kafelek */

.project-context-actions-start{
    --actions-left:0%;
    --actions-shift:0%;
    --connector-left:35%;
}

/* Oferta */

.project-context-actions-offer{
    --actions-left:30%;
    --actions-shift:-50%;
    --connector-left:50%;
}

/* Realizacja */

.project-context-actions-realization{
    --actions-left:50%;
    --actions-shift:-50%;
    --connector-left:50%;
}

/* Zakończony */

.project-context-actions-done{
    --actions-left:70%;
    --actions-shift:-50%;
    --connector-left:50%;
}

/* Rozliczony — ramka przyklejona do prawej, ale kreska celuje w ostatni kafelek */

.project-context-actions-paid{
    --actions-left:100%;
    --actions-shift:-100%;
    --connector-left:72%;
}

/* Statusy nietypowe */

.project-context-actions-lost,
.project-context-actions-paused{
    --actions-left:50%;
    --actions-shift:-50%;
    --connector-left:50%;
}

/* =========================
   BUDŻETY - ŁADNY PRZYCISK WYBIERZ PLIK
   ========================= */

#budget-import-file{
    padding:8px;
    background:#f8fafc;
    cursor:pointer;
}

#budget-import-file::file-selector-button{
    border:none;
    border-radius:10px;
    background:#2563eb;
    color:#ffffff;
    font-weight:900;
    padding:10px 14px;
    margin-right:12px;
    cursor:pointer;
    transition:0.15s ease;
}

#budget-import-file::file-selector-button:hover{
    background:#1d4ed8;
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(37,99,235,0.25);
}

/* Firefox */
#budget-import-file::-moz-file-upload-button{
    border:none;
    border-radius:10px;
    background:#2563eb;
    color:#ffffff;
    font-weight:900;
    padding:10px 14px;
    margin-right:12px;
    cursor:pointer;
}

.project-details-group{
    background:white;
    border:1px solid #e2e8f0;
    border-radius:18px;
    margin-bottom:16px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(15,23,42,0.06);
}

.project-details-group-header{
    width:100%;
    border:none;
    background:linear-gradient(180deg, #f8fafc, #eef2ff);
    color:#0f172a;
    padding:18px 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    font-size:15px;
    font-weight:800;
    text-align:left;
}

.project-details-group-header span{
    display:flex;
    align-items:center;
    gap:10px;
}

.project-details-group-header:hover{
    transform:none;
    box-shadow:none;
    background:linear-gradient(180deg, #eef2ff, #e0e7ff);
}

.project-details-group-header > i{
    transition:transform 0.2s ease;
}

.project-details-group-body{
    padding:20px;
}

.project-details-group.collapsed .project-details-group-body{
    display:none;
}

.project-details-group.collapsed .project-details-group-header > i{
    transform:rotate(-90deg);
}

.project-details-section-intro{
    background:#f8fafc;
    border:1px dashed #cbd5e1;
    color:#475569;
    padding:12px 14px;
    border-radius:12px;
    margin-bottom:14px;
    font-size:14px;
}

.additional-works-summary{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin-bottom:16px;
}

.additional-works-card{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:16px;
}

.additional-works-card span{
    display:block;
    color:#64748b;
    font-size:13px;
    font-weight:700;
    margin-bottom:8px;
}

.additional-works-card strong{
    display:block;
    color:#0f172a;
    font-size:22px;
}

.project-details-warning-box{
    background:#fff7ed;
    border:1px solid #fed7aa;
    color:#9a3412;
    padding:14px 16px;
    border-radius:14px;
    margin-bottom:16px;
    line-height:1.5;
}

.project-details-actions-row{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    margin-bottom:14px;
}

.project-details-actions-row button{
    border:none;
    border-radius:10px;
    padding:12px 16px;
    background:#2563eb;
    color:white;
    font-weight:700;
    cursor:pointer;
}

/* POPRAWKA: szczegóły projektu bez dolnego paska akcji */

#project-details-modal .project-details-modal-box{
    display:flex;
    flex-direction:column;
    max-height:92vh;
    overflow:hidden;
}

#project-details-modal .app-modal-header,
#project-details-modal .modal-tabs,
#project-details-modal .project-command-hero{
    flex-shrink:0;
}

#project-details-modal .details-tab-content{
    overflow:auto;
    padding-bottom:24px;
}

.project-details-header{
    align-items:center;
}

.project-details-header-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.project-details-edit-top-button{
    border:none;
    border-radius:10px;
    background:#2563eb;
    color:white;
    font-weight:800;
    padding:10px 14px;
    cursor:pointer;

    display:flex;
    align-items:center;
    gap:6px;
}

.project-details-edit-top-button:hover{
    background:#1d4ed8;
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(15,23,42,0.15);
}

.project-finance-result-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin-bottom:16px;
}

.project-finance-result-grid-small{
    grid-template-columns:repeat(2, 1fr);
}

.project-finance-result-card{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:16px;
}

.project-finance-result-card span{
    display:block;
    color:#64748b;
    font-size:13px;
    font-weight:800;
    margin-bottom:8px;
}

.project-finance-result-card strong{
    display:block;
    color:#0f172a;
    font-size:24px;
    margin-bottom:6px;
}

.project-finance-result-card small{
    color:#64748b;
    font-size:12px;
}

.project-finance-result-card.total{
    background:#eff6ff;
    border-color:#bfdbfe;
}

.project-finance-result-card.costs{
    background:#fff7ed;
    border-color:#fed7aa;
}

.project-finance-result-card.result{
    background:#f0fdf4;
    border-color:#bbf7d0;
}

.project-finance-result-card.margin{
    background:#f5f3ff;
    border-color:#ddd6fe;
}

@media(max-width:1100px){
    .project-finance-result-grid,
    .project-finance-result-grid-small{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   SZCZEGÓŁY PROJEKTU — ŁADNIEJSZE WEWNĘTRZNE SEKCJE
   ========================================================= */

#project-details-modal .project-details-group{
    background:#ffffff;
    border:1px solid #dbe3ef;
    border-radius:16px;
    margin-bottom:16px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(15,23,42,0.06);
}

#project-details-modal .project-details-group-header{
    width:100%;
    border:none;
    border-bottom:1px solid #e5eaf3;
    background:linear-gradient(180deg, #f8fafc, #eef2f7);
    color:#172033;
    padding:15px 18px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    font-size:15px;
    font-weight:800;
    text-align:left;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}

#project-details-modal .project-details-group-header span{
    display:flex;
    align-items:center;
    gap:10px;
}

#project-details-modal .project-details-group-header span i{
    color:#2563eb;
}

#project-details-modal .project-details-group-header:hover{
    background:linear-gradient(180deg, #eef4ff, #e6eefc);
    color:#172033;
    box-shadow:none;
    transform:none;
}

#project-details-modal .project-details-group-header:hover span,
#project-details-modal .project-details-group-header:hover i{
    color:#172033;
}

#project-details-modal .project-details-group-header > i{
    color:#334155;
    transition:transform 0.25s ease;
}

#project-details-modal .project-details-group-body{
    display:block !important;
    max-height:5000px;
    overflow:hidden;
    opacity:1;
    padding:20px;
    transition:
        max-height 0.35s ease,
        opacity 0.25s ease,
        padding-top 0.25s ease,
        padding-bottom 0.25s ease;
}

#project-details-modal .project-details-group.collapsed .project-details-group-body{
    max-height:0;
    opacity:0;
    padding-top:0;
    padding-bottom:0;
}

#project-details-modal .project-details-group.collapsed .project-details-group-header{
    border-bottom:none;
}

#project-details-modal .project-details-group.collapsed .project-details-group-header > i{
    transform:rotate(-90deg);
}

#project-details-modal .project-details-section-intro{
    background:#f8fafc;
    border:1px dashed #cbd5e1;
    color:#475569;
    padding:12px 14px;
    border-radius:12px;
    margin-bottom:16px;
    font-size:14px;
    line-height:1.5;
}

/* Blokada przewijania strony pod otwartym modalem */

body.project-details-open{
    overflow:hidden;
}

#project-details-modal{
    overscroll-behavior:contain;
}

#project-details-modal .modal-box{
    overscroll-behavior:contain;
}

/* =========================================================
   SZCZEGÓŁY PROJEKTU — FINALNY UX AKORDEONÓW I SCROLLA
   ========================================================= */

/* Modal: nagłówek i górne zakładki zostają, przewija się tylko treść */

#project-details-modal .project-details-modal-box{
    display:flex !important;
    flex-direction:column !important;
    max-height:calc(100vh - 40px) !important;
    overflow:hidden !important;
}

#project-details-modal .app-modal-header,
#project-details-modal .modal-tabs{
    flex:0 0 auto !important;
    position:relative;
    z-index:20;
    background:white;
}

#project-details-modal .modal-tabs{
    margin-bottom:14px !important;
    padding-top:8px !important;
    padding-bottom:0 !important;
    border-bottom:1px solid #cbd5e1 !important;
}

#project-details-modal .details-tab-content{
    flex:1 1 auto !important;
    min-height:0 !important;
    max-height:none !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    padding:18px 8px 18px 0 !important;

    overscroll-behavior:contain !important;
}


/* Lepsze oddzielenie wewnętrznych sekcji */

#project-details-modal .project-details-group{
    position:relative;
    background:#ffffff !important;
    border:1px solid #d8e1ee !important;
    border-radius:18px !important;
    margin-bottom:18px !important;
    overflow:hidden !important;

    box-shadow:
        0 10px 24px rgba(15,23,42,0.07),
        0 2px 6px rgba(15,23,42,0.04) !important;
}

/* Delikatny kolorowy pasek z lewej, żeby sekcje się nie zlewały */

#project-details-modal .project-details-group::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:4px;
    background:linear-gradient(180deg, #2563eb, #38bdf8);
    opacity:0.85;
}


/* Nagłówek sekcji — spokojny, czytelny, bez agresywnego niebieskiego */

#project-details-modal .project-details-group-header{
    width:100% !important;
    border:none !important;
    border-bottom:1px solid #e2e8f0 !important;

    background:
        linear-gradient(180deg, #ffffff, #f1f5f9) !important;

    color:#0f172a !important;

    padding:17px 20px 17px 22px !important;

    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;

    cursor:pointer !important;

    font-size:15px !important;
    font-weight:900 !important;
    text-align:left !important;

    box-shadow:none !important;
    transform:none !important;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

#project-details-modal .project-details-group-header span{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    color:#0f172a !important;
}

#project-details-modal .project-details-group-header span i{
    width:28px;
    height:28px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    background:#eff6ff;
    color:#2563eb !important;

    margin-right:0 !important;
}


/* Hover — czytelny, bez białej czcionki */

#project-details-modal .project-details-group-header:hover{
    background:
        linear-gradient(180deg, #f8fafc, #eaf1fb) !important;

    color:#0f172a !important;
    transform:none !important;
    box-shadow:none !important;
}

#project-details-modal .project-details-group-header:hover span,
#project-details-modal .project-details-group-header:hover span i,
#project-details-modal .project-details-group-header:hover > i{
    color:#0f172a !important;
}

#project-details-modal .project-details-group-header:hover span i{
    background:#dbeafe !important;
    color:#1d4ed8 !important;
}


/* Strzałka */

#project-details-modal .project-details-group-header > i{
    color:#334155 !important;
    margin-right:0 !important;
    transition:transform 0.25s ease;
}


/* Treść sekcji — jaśniejsze tło, większy oddech */

#project-details-modal .project-details-group-body{
    display:block !important;
    max-height:3200px;
    opacity:1;

    overflow:hidden !important;

    padding:22px !important;

    background:
        linear-gradient(180deg, #ffffff, #fbfdff);

    transition:
        max-height 0.35s ease,
        opacity 0.25s ease,
        padding-top 0.25s ease,
        padding-bottom 0.25s ease;
}


/* Zwinięta sekcja */

#project-details-modal .project-details-group.collapsed .project-details-group-body{
    max-height:0 !important;
    opacity:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
}

#project-details-modal .project-details-group.collapsed .project-details-group-header{
    border-bottom:none !important;
    background:
        linear-gradient(180deg, #ffffff, #f8fafc) !important;
}

#project-details-modal .project-details-group.collapsed .project-details-group-header > i{
    transform:rotate(-90deg);
}


/* Opis w środku sekcji — trochę spokojniejszy */

#project-details-modal .project-details-section-intro{
    background:#f8fafc !important;
    border:1px solid #dbe3ef !important;
    border-left:4px solid #bfdbfe !important;

    color:#475569 !important;

    padding:13px 15px !important;
    border-radius:14px !important;

    margin-bottom:18px !important;

    font-size:14px !important;
    line-height:1.5 !important;
}


/* Lepsze odstępy między tabelami w akordeonach */

#project-details-modal .project-details-group table{
    margin-top:14px !important;
    margin-bottom:0 !important;
}


/* Scrollbar w treści szczegółów — mniej agresywny */

#project-details-modal .details-tab-content::-webkit-scrollbar{
    width:10px;
}

#project-details-modal .details-tab-content::-webkit-scrollbar-track{
    background:#f1f5f9;
    border-radius:999px;
}

#project-details-modal .details-tab-content::-webkit-scrollbar-thumb{
    background:#cbd5e1;
    border-radius:999px;
    border:2px solid #f1f5f9;
}

#project-details-modal .details-tab-content::-webkit-scrollbar-thumb:hover{
    background:#94a3b8;
}


/* Blokada przewijania strony pod modalem */

body.project-details-open{
    overflow:hidden !important;
}

#project-details-modal,
#project-details-modal .modal-box,
#project-details-modal .details-tab-content{
    overscroll-behavior:contain !important;
}

.project-context-actions{
    width:100%;
    display:flex;
    justify-content:center;
    margin:10px 0 16px 0;
    padding:0 20px;
    box-sizing:border-box;
}

.project-context-actions-panel{
    width:100%;
    max-width:980px;
    border:1px solid #dbeafe;
    border-radius:18px;
    background:#ffffff;
    box-shadow:0 8px 20px rgba(15,23,42,0.06);
    padding:12px 14px;
    box-sizing:border-box;
}

.project-context-actions-header{
    padding:0 2px 8px 2px;
    margin-bottom:10px;
    border-bottom:1px solid #eef2ff;
}

.project-context-actions-header strong{
    display:block;
    font-size:14px;
    font-weight:800;
    color:#0f172a;
}

.project-context-actions-header span{
    display:block;
    margin-top:2px;
    font-size:12px;
    color:#64748b;
}

.project-context-actions-list{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.project-context-action{
    border:1px solid #bfdbfe;
    background:#eff6ff;
    color:#1d4ed8;
    border-radius:999px;
    padding:8px 13px;
    min-height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    cursor:pointer;
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
    box-shadow:none;
    transition:0.15s ease;
}

.project-context-action i{
    font-size:13px;
    color:inherit;
    opacity:1;
}

.project-context-action span{
    color:inherit;
}

.project-context-action:hover{
    transform:translateY(-1px);
    background:#dbeafe;
    border-color:#2563eb;
}

.project-context-action.primary{
    background:#2563eb;
    border-color:#2563eb;
    color:#ffffff;
}

.project-context-action.finance{
    background:#ecfdf5;
    border-color:#bbf7d0;
    color:#047857;
}

.project-context-action.warning{
    background:#fff7ed;
    border-color:#fed7aa;
    color:#c2410c;
}

.project-context-action.danger{
    background:#fef2f2;
    border-color:#fecaca;
    color:#b91c1c;
}

@media(max-width:900px){

    .project-context-actions{
        padding:0 10px;
    }

    .project-context-actions-panel{
        max-width:100%;
    }

    .project-context-action{
        font-size:12px;
        padding:7px 11px;
    }
}
/* =====================================================
   KOMPAKTOWE CENTRUM AKCJI PROJEKTU — POPRAWKA UI
   ===================================================== */

.project-context-actions{
    width:100% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    margin:10px 0 18px 0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border:none !important;
    outline:none !important;
    background:transparent !important;
    overflow:visible !important;
}

.project-context-actions-panel{
    width:auto !important;
    max-width:calc(100% - 80px) !important;
    min-width:0 !important;
    display:inline-block !important;
    border:1px solid #dbeafe !important;
    outline:none !important;
    border-radius:16px !important;
    background:#ffffff !important;
    box-shadow:0 8px 22px rgba(15,23,42,0.07) !important;
    padding:12px 14px !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
}

.project-context-actions-header{
    padding:0 0 8px 0 !important;
    margin:0 0 10px 0 !important;
    border:none !important;
    border-bottom:1px solid #e5e7eb !important;
    background:transparent !important;
}

.project-context-actions-header strong{
    display:block !important;
    font-size:14px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    color:#0f172a !important;
    margin:0 !important;
}

.project-context-actions-header span{
    display:block !important;
    margin-top:3px !important;
    font-size:12px !important;
    line-height:1.25 !important;
    color:#64748b !important;
}

.project-context-actions-list{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:8px !important;
    border:none !important;
    outline:none !important;
    background:transparent !important;
    max-width:100% !important;
    overflow:visible !important;
}

.project-context-action{
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;

    padding:0 13px !important;
    border-radius:999px !important;
    border:1px solid #bfdbfe !important;

    background:#eff6ff !important;
    color:#1d4ed8 !important;

    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;

    box-shadow:none !important;
    cursor:pointer !important;
    overflow:hidden !important;
    text-align:center !important;
}

.project-context-action i{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:12px !important;
    line-height:1 !important;
    color:currentColor !important;
    opacity:1 !important;
    margin:0 !important;
}

.project-context-action span{
    display:inline-block !important;
    color:currentColor !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
    margin:0 !important;
    padding:0 !important;
}

.project-context-action:hover{
    transform:translateY(-1px) !important;
    background:#dbeafe !important;
    border-color:#2563eb !important;
    color:#1d4ed8 !important;
}

.project-context-action.primary{
    background:#2563eb !important;
    border-color:#2563eb !important;
    color:#ffffff !important;
}

.project-context-action.primary:hover{
    background:#1d4ed8 !important;
    border-color:#1d4ed8 !important;
    color:#ffffff !important;
}

.project-context-action.finance{
    background:#ecfdf5 !important;
    border-color:#bbf7d0 !important;
    color:#047857 !important;
}

.project-context-action.finance:hover{
    background:#d1fae5 !important;
    border-color:#34d399 !important;
    color:#065f46 !important;
}

.project-context-action.warning{
    background:#fff7ed !important;
    border-color:#fed7aa !important;
    color:#c2410c !important;
}

.project-context-action.warning:hover{
    background:#ffedd5 !important;
    border-color:#fb923c !important;
    color:#9a3412 !important;
}

.project-context-action.danger{
    background:#fef2f2 !important;
    border-color:#fecaca !important;
    color:#b91c1c !important;
}

.project-context-action.danger:hover{
    background:#fee2e2 !important;
    border-color:#f87171 !important;
    color:#991b1b !important;
}

@media(max-width:900px){

    .project-context-actions-panel{
        max-width:calc(100% - 24px) !important;
        width:calc(100% - 24px) !important;
    }

    .project-context-actions-list{
        justify-content:flex-start !important;
    }

    .project-context-action{
        height:32px !important;
        min-height:32px !important;
        max-height:32px !important;
        font-size:12px !important;
        padding:0 11px !important;
    }

    .project-context-action span{
        font-size:12px !important;
    }
}

/* =====================================================
   CENTRUM AKCJI PROJEKTU — WERSJA FINALNA KOMPAKTOWA
   ===================================================== */

#project-context-actions,
.project-context-actions{
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;

    display:flex !important;
    justify-content:center !important;
    align-items:center !important;

    margin:10px auto 18px auto !important;
    padding:0 !important;

    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    outline:none !important;

    overflow:visible !important;
    box-sizing:border-box !important;
}

#project-context-actions::before,
#project-context-actions::after,
.project-context-actions::before,
.project-context-actions::after{
    display:none !important;
    content:none !important;
}

#project-context-actions .project-context-actions-panel{
    width:auto !important;
    max-width:900px !important;
    min-width:0 !important;

    display:inline-block !important;

    background:#ffffff !important;
    border:1px solid #dbeafe !important;
    border-radius:14px !important;

    box-shadow:0 8px 20px rgba(15,23,42,0.08) !important;

    padding:10px 12px !important;
    margin:0 auto !important;

    box-sizing:border-box !important;
    overflow:visible !important;
}

#project-context-actions .project-context-actions-header{
    margin:0 0 8px 0 !important;
    padding:0 0 7px 0 !important;

    background:transparent !important;
    border:none !important;
    border-bottom:1px solid #e5e7eb !important;
    box-shadow:none !important;
}

#project-context-actions .project-context-actions-header strong{
    display:block !important;
    margin:0 !important;

    font-size:14px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    color:#0f172a !important;
}

#project-context-actions .project-context-actions-header span{
    display:block !important;
    margin:2px 0 0 0 !important;

    font-size:12px !important;
    line-height:1.25 !important;
    color:#475569 !important;
}

#project-context-actions .project-context-actions-list{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:flex-start !important;
    align-items:center !important;

    gap:7px !important;

    width:auto !important;
    max-width:100% !important;

    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    outline:none !important;
    overflow:visible !important;
}

/* przyciski — baza */
#project-context-actions .project-context-action{
    width:auto !important;
    height:32px !important;
    min-height:32px !important;
    max-height:32px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:6px !important;

    padding:0 12px !important;

    border-radius:999px !important;
    border:1px solid #bfdbfe !important;

    background:#eff6ff !important;
    color:#1d4ed8 !important;

    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;

    white-space:nowrap !important;
    text-align:center !important;

    box-shadow:none !important;
    cursor:pointer !important;
    opacity:1 !important;
    filter:none !important;
}

#project-context-actions .project-context-action i,
#project-context-actions .project-context-action span{
    color:currentColor !important;
    opacity:1 !important;
    filter:none !important;
    text-shadow:none !important;
}

#project-context-actions .project-context-action i{
    font-size:12px !important;
    line-height:1 !important;
}

#project-context-actions .project-context-action span{
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
}

#project-context-actions .project-context-action:hover{
    transform:translateY(-1px) !important;
    background:#dbeafe !important;
    border-color:#2563eb !important;
    color:#1d4ed8 !important;
}

/* główna akcja */
#project-context-actions .project-context-action.primary{
    background:#2563eb !important;
    border-color:#2563eb !important;
    color:#ffffff !important;
}

#project-context-actions .project-context-action.primary:hover{
    background:#1d4ed8 !important;
    border-color:#1d4ed8 !important;
    color:#ffffff !important;
}

/* finanse */
#project-context-actions .project-context-action.finance{
    background:#ecfdf5 !important;
    border-color:#86efac !important;
    color:#047857 !important;
}

#project-context-actions .project-context-action.finance:hover{
    background:#d1fae5 !important;
    border-color:#22c55e !important;
    color:#065f46 !important;
}

/* ostrzeżenia */
#project-context-actions .project-context-action.warning{
    background:#fff7ed !important;
    border-color:#fdba74 !important;
    color:#c2410c !important;
}

#project-context-actions .project-context-action.warning:hover{
    background:#ffedd5 !important;
    border-color:#f97316 !important;
    color:#9a3412 !important;
}

/* utracone / martwe */
#project-context-actions .project-context-action.danger{
    background:#fef2f2 !important;
    border-color:#fca5a5 !important;
    color:#b91c1c !important;
}

#project-context-actions .project-context-action.danger:hover{
    background:#fee2e2 !important;
    border-color:#ef4444 !important;
    color:#991b1b !important;
}

/* zwykłe akcje mają być czytelne, nie blade */
#project-context-actions .project-context-action.secondary{
    background:#eff6ff !important;
    border-color:#bfdbfe !important;
    color:#1d4ed8 !important;
}

#project-context-actions .project-context-action.secondary:hover{
    background:#dbeafe !important;
    border-color:#2563eb !important;
    color:#1d4ed8 !important;
}

@media(max-width:900px){

    #project-context-actions .project-context-actions-panel{
        max-width:calc(100vw - 48px) !important;
    }

    #project-context-actions .project-context-action{
        height:31px !important;
        min-height:31px !important;
        max-height:31px !important;

        padding:0 10px !important;
        font-size:12px !important;
    }

    #project-context-actions .project-context-action span{
        font-size:12px !important;
    }
}

.project-budget-comparison-panel{
    margin:18px 0 20px 0;
    padding:18px;
    border-radius:18px;
    background:linear-gradient(135deg, #f8fafc, #eef2ff);
    border:1px solid #e2e8f0;
}

.project-budget-comparison-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:14px;
    margin-bottom:18px;
}

.project-budget-comparison-card{
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:14px;
    box-shadow:0 8px 20px rgba(15, 23, 42, 0.06);
    transition:transform 0.2s ease, box-shadow 0.2s ease;
}

.project-budget-comparison-card:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(15, 23, 42, 0.10);
}

.project-budget-comparison-card span{
    display:block;
    font-size:12px;
    color:#64748b;
    margin-bottom:6px;
}

.project-budget-comparison-card strong{
    display:block;
    font-size:20px;
    color:#0f172a;
    margin-bottom:4px;
}

.project-budget-comparison-card small{
    color:#64748b;
    font-size:12px;
}

.project-budget-comparison-card.good strong{
    color:#15803d;
}

.project-budget-comparison-card.warning strong{
    color:#b45309;
}

.project-budget-comparison-card.danger strong{
    color:#b91c1c;
}

.project-budget-bars{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.project-budget-bar-row{
    display:grid;
    grid-template-columns:160px 1fr;
    align-items:center;
    gap:14px;
}

.project-budget-bar-label span{
    display:block;
    font-size:12px;
    color:#64748b;
}

.project-budget-bar-label strong{
    display:block;
    font-size:14px;
    color:#0f172a;
}

.project-budget-bar-track{
    height:18px;
    background:#e2e8f0;
    border-radius:999px;
    overflow:hidden;
    position:relative;
}

.project-budget-bar-fill{
    height:100%;
    width:0%;
    border-radius:999px;
    transition:width 0.7s ease;
}

.project-budget-bar-fill.plan{
    background:linear-gradient(90deg, #2563eb, #60a5fa);
}

.project-budget-bar-fill.actual{
    background:linear-gradient(90deg, #16a34a, #86efac);
}

.project-budget-bar-fill.actual.over-budget{
    background:linear-gradient(90deg, #dc2626, #f97316);
}

@media (max-width: 1100px){

    .project-budget-comparison-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 700px){

    .project-budget-comparison-grid{
        grid-template-columns:1fr;
    }

    .project-budget-bar-row{
        grid-template-columns:1fr;
    }

}

/* =========================================================
   PROJECT PROCESS BAR - CLIP PATH VERSION
   Timeline projektu bez wystających trójkątów
   ========================================================= */

.project-process-bar{
    display:grid !important;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    gap:6px !important;
    margin:18px 0 !important;
    overflow:visible !important;
}

.project-process-bar > *{
    position:relative !important;
    min-height:56px !important;
    padding:0 34px 0 26px !important;
    background:#f8fafc !important;
    border:1px solid #e2e8f0 !important;
    color:#475569 !important;
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    font-weight:800 !important;
    box-shadow:0 8px 20px rgba(15, 23, 42, 0.05) !important;
    overflow:hidden !important;
    clip-path:polygon(
        0 0,
        calc(100% - 20px) 0,
        100% 50%,
        calc(100% - 20px) 100%,
        0 100%,
        20px 50%
    ) !important;
}

.project-process-bar > *:first-child{
    clip-path:polygon(
        0 0,
        calc(100% - 20px) 0,
        100% 50%,
        calc(100% - 20px) 100%,
        0 100%
    ) !important;
    border-top-left-radius:16px !important;
    border-bottom-left-radius:16px !important;
}

.project-process-bar > *:last-child{
    clip-path:polygon(
        0 0,
        100% 0,
        100% 100%,
        0 100%,
        20px 50%
    ) !important;
    border-top-right-radius:16px !important;
    border-bottom-right-radius:16px !important;
}

/* wyłączamy stare trójkąty, jeśli wcześniejszy CSS je tworzył */
.project-process-bar > *::before,
.project-process-bar > *::after{
    display:none !important;
}

/* numer kroku */
.project-process-bar > * span:first-child,
.project-process-bar > * .project-process-step-number,
.project-process-bar > * .process-step-number{
    min-width:30px !important;
    width:30px !important;
    height:30px !important;
    border-radius:999px !important;
    background:#e2e8f0 !important;
    color:#475569 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-weight:900 !important;
    font-size:14px !important;
    flex:0 0 auto !important;
    box-shadow:none !important;
}

/* krok wykonany */
.project-process-bar > *.done,
.project-process-bar > *.completed,
.project-process-bar > *.is-done{
    background:#dbeafe !important;
    border-color:#bfdbfe !important;
    color:#1d4ed8 !important;
}

.project-process-bar > *.done span:first-child,
.project-process-bar > *.completed span:first-child,
.project-process-bar > *.is-done span:first-child,
.project-process-bar > *.done .project-process-step-number,
.project-process-bar > *.completed .project-process-step-number,
.project-process-bar > *.is-done .project-process-step-number,
.project-process-bar > *.done .process-step-number,
.project-process-bar > *.completed .process-step-number,
.project-process-bar > *.is-done .process-step-number{
    background:#2563eb !important;
    color:#ffffff !important;
}

/* krok aktywny */
.project-process-bar > *.active,
.project-process-bar > *.current,
.project-process-bar > *.is-active{
    background:#2563eb !important;
    border-color:#2563eb !important;
    color:#ffffff !important;
    box-shadow:0 12px 28px rgba(37, 99, 235, 0.28) !important;
}

.project-process-bar > *.active span:first-child,
.project-process-bar > *.current span:first-child,
.project-process-bar > *.is-active span:first-child,
.project-process-bar > *.active .project-process-step-number,
.project-process-bar > *.current .project-process-step-number,
.project-process-bar > *.is-active .project-process-step-number,
.project-process-bar > *.active .process-step-number,
.project-process-bar > *.current .process-step-number,
.project-process-bar > *.is-active .process-step-number{
    background:#ffffff !important;
    color:#2563eb !important;
}

/* delikatny hover */
.project-process-bar > *{
    transition:transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
}

.project-process-bar > *:hover{
    transform:translateY(-1px) !important;
    box-shadow:0 12px 28px rgba(15, 23, 42, 0.10) !important;
}

/* flaga w kratkę na ostatnim kroku, gdy projekt jest rozliczony */
.project-process-bar > *:last-child.active,
.project-process-bar > *:last-child.current,
.project-process-bar > *:last-child.is-active,
.project-process-bar > *:last-child.done,
.project-process-bar > *:last-child.completed,
.project-process-bar > *:last-child.is-done{
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.16) 25%,
            transparent 25%
        ),
        linear-gradient(
            225deg,
            rgba(255, 255, 255, 0.16) 25%,
            transparent 25%
        ),
        linear-gradient(
            315deg,
            rgba(255, 255, 255, 0.16) 25%,
            transparent 25%
        ),
        linear-gradient(
            45deg,
            rgba(255, 255, 255, 0.16) 25%,
            transparent 25%
        ),
        #0f172a !important;
    background-size:18px 18px !important;
    background-position:0 0, 0 9px, 9px -9px, -9px 0 !important;
    color:#ffffff !important;
    border-color:#0f172a !important;
}

.project-process-bar > *:last-child.active span:first-child,
.project-process-bar > *:last-child.current span:first-child,
.project-process-bar > *:last-child.is-active span:first-child,
.project-process-bar > *:last-child.done span:first-child,
.project-process-bar > *:last-child.completed span:first-child,
.project-process-bar > *:last-child.is-done span:first-child,
.project-process-bar > *:last-child.active .project-process-step-number,
.project-process-bar > *:last-child.current .project-process-step-number,
.project-process-bar > *:last-child.is-active .project-process-step-number,
.project-process-bar > *:last-child.done .project-process-step-number,
.project-process-bar > *:last-child.completed .project-process-step-number,
.project-process-bar > *:last-child.is-done .project-process-step-number,
.project-process-bar > *:last-child.active .process-step-number,
.project-process-bar > *:last-child.current .process-step-number,
.project-process-bar > *:last-child.is-active .process-step-number,
.project-process-bar > *:last-child.done .process-step-number,
.project-process-bar > *:last-child.completed .process-step-number,
.project-process-bar > *:last-child.is-done .process-step-number{
    background:#ffffff !important;
    color:#0f172a !important;
}

/* responsywność */
@media (max-width: 1100px){

    .project-process-bar{
        grid-template-columns:1fr !important;
        gap:10px !important;
    }

    .project-process-bar > *,
    .project-process-bar > *:first-child,
    .project-process-bar > *:last-child{
        clip-path:none !important;
        border-radius:16px !important;
        padding:14px 18px !important;
    }

}

/* =========================================================
   PROJECT LIST ALERTS
   Małe alerty przy projekcie na liście projektów
   ========================================================= */

.project-list-topic{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.project-list-topic strong{
    color:#0f172a;
    font-weight:800;
}

.project-list-alerts{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.project-list-alert{
    display:inline-flex;
    align-items:center;
    min-height:20px;
    padding:3px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    letter-spacing:0.03em;
    line-height:1;
    white-space:nowrap;
    border:1px solid transparent;
}

.project-list-alert.warning{
    background:#fef3c7;
    color:#92400e;
    border-color:#fde68a;
}

.project-list-alert.danger{
    background:#fee2e2;
    color:#991b1b;
    border-color:#fecaca;
}

.project-list-alert.invoice{
    background:#dcfce7;
    color:#166534;
    border-color:#bbf7d0;
}

.project-list-alert-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-right:4px;
    font-size:10px;
    line-height:1;
}


/* =========================================================
   DASHBOARD MOBILE LAYOUT
   Kondycja projektów pod kaflami na telefonie
   ========================================================= */

@media (max-width: 900px){

    .dashboard-top-layout{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:18px !important;
    }

    .dashboard-top-cards{
        width:100% !important;
    }

    .dashboard-chart-card{
        width:100% !important;
        min-width:0 !important;
    }

    .dashboard-chart-layout{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:16px !important;
    }

    .dashboard-chart-canvas-wrap{
        margin:0 auto !important;
        max-width:280px !important;
        width:100% !important;
    }

    .dashboard-chart-legend{
        width:100% !important;
    }

}
/* =========================================================
   TABLE ICON ACTIONS
   Małe ikonki akcji w tabelach
   ========================================================= */

.table-icon-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
}

.table-icon-action{
    width:30px;
    height:30px;
    border-radius:999px;
    border:1px solid #dbeafe;
    background:#eff6ff;
    color:#2563eb;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.table-icon-action:hover{
    background:#dbeafe;
    transform:translateY(-1px);
    box-shadow:0 8px 18px rgba(37, 99, 235, 0.16);
}


.table-icon-action.danger{
    border-color:#dc2626;
    background:#dc2626;
    color:#ffffff;
}

.table-icon-action.danger:hover{
    background:#b91c1c;
    color:#ffffff;
    border-color:#b91c1c;
    box-shadow:0 8px 18px rgba(220, 38, 38, 0.20);
}

.table-icon-action i{
    font-size:13px;
    pointer-events:none;
}

/* =========================================================
   APP MESSAGES
   Ładne komunikaty zamiast alert()
   ========================================================= */

.app-message-box{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:1000001;
    display:flex;
    flex-direction:column;
    gap:10px;
    max-width:420px;
    width:calc(100% - 44px);
    pointer-events:none;
}

.app-message{
    pointer-events:auto;
    display:grid;
    grid-template-columns:34px 1fr 28px;
    gap:10px;
    align-items:flex-start;
    padding:14px;
    border-radius:16px;
    background:#ffffff;
    border:1px solid #e2e8f0;
    box-shadow:0 18px 42px rgba(15, 23, 42, 0.18);
    animation:appMessageSlideIn 0.22s ease;
}

.app-message-icon{
    width:34px;
    height:34px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
}

.app-message-content strong{
    display:block;
    font-size:14px;
    color:#0f172a;
    margin-bottom:4px;
}

.app-message-content span{
    display:block;
    font-size:13px;
    color:#475569;
    line-height:1.35;
    white-space:pre-line;
}

.app-message-close{
    width:28px;
    height:28px;
    border:0;
    background:transparent;
    color:#94a3b8;
    cursor:pointer;
    border-radius:999px;
}

.app-message-close:hover{
    background:#f1f5f9;
    color:#0f172a;
}

.app-message.success{
    border-color:#bbf7d0;
}

.app-message.success .app-message-icon{
    background:#dcfce7;
    color:#15803d;
}

.app-message.warning{
    border-color:#fde68a;
}

.app-message.warning .app-message-icon{
    background:#fef3c7;
    color:#b45309;
}

.app-message.error{
    border-color:#fecaca;
}

.app-message.error .app-message-icon{
    background:#fee2e2;
    color:#dc2626;
}

@keyframes appMessageSlideIn{

    from{
        opacity:0;
        transform:translateY(10px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@media (max-width: 700px){

    .app-message-box{
        left:14px;
        right:14px;
        bottom:14px;
        width:auto;
        max-width:none;
    }

}

/* =========================================
   MODAL KOSZTU — NOWY WYGLĄD
   ========================================= */

#budget-cost-form.budget-cost-modal{
    position:fixed !important;
    inset:0 !important;

    width:100vw !important;
    height:100vh !important;

    padding:24px !important;

    align-items:center !important;
    justify-content:center !important;

    background:rgba(15,23,42,0.68) !important;

    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);

    z-index:100260 !important;
}

#budget-cost-form[style*="display: block"],
#budget-cost-form[style*="display:block"],
#budget-cost-form[style*="display: flex"],
#budget-cost-form[style*="display:flex"]{
    display:flex !important;
}

#budget-cost-form .budget-cost-modal-box{
    width:min(860px, 95vw) !important;
    max-width:95vw !important;

    height:auto !important;
    max-height:92vh !important;

    margin:auto !important;
    padding:0 !important;

    display:flex !important;
    flex-direction:column !important;
    gap:0 !important;

    overflow:hidden !important;

    background:#f8fafc !important;

    border:1px solid rgba(255,255,255,0.75) !important;
    border-radius:24px !important;

    box-shadow:
        0 35px 90px rgba(15,23,42,0.42),
        0 8px 24px rgba(15,23,42,0.20) !important;
}


/* NAGŁÓWEK */

#budget-cost-form .budget-cost-modal-header{
    flex:0 0 auto;

    min-height:112px;

    padding:22px 24px;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;

    color:#ffffff;

    background:
        radial-gradient(
            circle at top right,
            rgba(96,165,250,0.40),
            transparent 38%
        ),
        linear-gradient(
            135deg,
            #0f172a,
            #172554 55%,
            #1d4ed8
        );

    border:none;
}

#budget-cost-form .budget-cost-modal-title-row{
    min-width:0;

    display:flex;
    align-items:center;
    gap:16px;
}

#budget-cost-form .budget-cost-modal-icon{
    width:58px;
    height:58px;
    min-width:58px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(255,255,255,0.22);
    border-radius:18px;

    background:rgba(255,255,255,0.14);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.18),
        0 10px 24px rgba(15,23,42,0.20);

    font-size:25px;
}

#budget-cost-form .budget-cost-modal-icon i{
    margin:0;
}

#budget-cost-form .budget-cost-modal-title{
    min-width:0;
}

#budget-cost-form .budget-cost-modal-kicker{
    display:block;

    margin-bottom:4px;

    color:#bfdbfe;

    font-size:11px;
    font-weight:900;

    text-transform:uppercase;
    letter-spacing:0.12em;
}

#budget-cost-form .budget-cost-modal-title h2{
    margin:0;

    color:#ffffff;

    font-size:25px;
    line-height:1.2;
    letter-spacing:-0.02em;
}

#budget-cost-form .budget-cost-modal-title p{
    max-width:580px;

    margin:7px 0 0 0;

    color:#dbeafe;

    font-size:13px;
    line-height:1.5;
}

#budget-cost-form .budget-cost-modal-close{
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;

    margin:0;
    padding:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(255,255,255,0.20);
    border-radius:14px;

    background:rgba(255,255,255,0.12) !important;
    color:#ffffff !important;

    font-size:18px;

    box-shadow:none;
}

#budget-cost-form .budget-cost-modal-close i{
    margin:0;
}

#budget-cost-form .budget-cost-modal-close:hover{
    transform:none;

    background:rgba(255,255,255,0.22) !important;

    box-shadow:none;
}


/* PRZEWIJANA TREŚĆ */

#budget-cost-form .budget-cost-modal-scroll{
    flex:1 1 auto;
    min-height:0;

    padding:20px;

    display:flex;
    flex-direction:column;
    gap:16px;

    overflow-y:auto;
    overflow-x:hidden;

    background:
        linear-gradient(
            180deg,
            #f8fafc,
            #f1f5f9
        );

    overscroll-behavior:contain;
}


/* SEKCJE */

#budget-cost-form .budget-cost-section{
    width:100%;
    min-width:0;

    padding:18px;

    background:#ffffff;

    border:1px solid #e2e8f0;
    border-radius:18px;

    box-shadow:
        0 5px 16px rgba(15,23,42,0.05),
        0 1px 3px rgba(15,23,42,0.04);
}

#budget-cost-form .budget-cost-section-heading{
    display:flex;
    align-items:center;
    gap:12px;

    margin-bottom:16px;
    padding-bottom:14px;

    border-bottom:1px solid #eef2f7;
}

#budget-cost-form .budget-cost-section-icon{
    width:42px;
    height:42px;
    min-width:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:13px;

    background:linear-gradient(
        135deg,
        #dbeafe,
        #eff6ff
    );

    color:#2563eb;

    font-size:17px;
}

#budget-cost-form .budget-cost-section-icon i{
    margin:0;
}

#budget-cost-form .budget-cost-section-heading h3{
    margin:0;

    color:#0f172a;

    font-size:16px;
    line-height:1.3;
}

#budget-cost-form .budget-cost-section-heading p{
    margin:3px 0 0 0;

    color:#64748b;

    font-size:12px;
    line-height:1.4;
}


/* POLA */

#budget-cost-form .budget-cost-form-grid{
    width:100%;

    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:15px;
}

#budget-cost-form .budget-cost-form-grid label{
    min-width:0;

    display:flex;
    flex-direction:column;
    gap:7px;

    margin:0;
}

#budget-cost-form .budget-cost-form-grid label > span{
    color:#475569;

    font-size:12px;
    font-weight:800;
}

#budget-cost-form .budget-cost-full{
    grid-column:1 / -1;
}

#budget-cost-form input,
#budget-cost-form select,
#budget-cost-form textarea{
    width:100%;
    max-width:100%;

    margin:0;
    padding:13px 14px;

    box-sizing:border-box;

    border:1px solid #cbd5e1;
    border-radius:12px;

    background:#f8fafc;
    color:#0f172a;

    font-size:14px;
    line-height:1.35;

    box-shadow:
        inset 0 1px 2px rgba(15,23,42,0.03);

    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
}

#budget-cost-form input,
#budget-cost-form select{
    min-height:48px;
}

#budget-cost-form textarea{
    min-height:112px;

    resize:vertical;
}

#budget-cost-form input:hover,
#budget-cost-form select:hover,
#budget-cost-form textarea:hover{
    border-color:#94a3b8;
    background:#ffffff;
}

#budget-cost-form input:focus,
#budget-cost-form select:focus,
#budget-cost-form textarea:focus{
    outline:none;

    border-color:#2563eb;
    background:#ffffff;

    box-shadow:
        0 0 0 4px rgba(37,99,235,0.12);
}

#budget-cost-form input::placeholder,
#budget-cost-form textarea::placeholder{
    color:#94a3b8;
}


/* KWOTA */

#budget-cost-form .budget-cost-amount-field{
    position:relative;

    width:100%;
}

#budget-cost-form .budget-cost-amount-field input{
    padding-right:52px;
}

#budget-cost-form .budget-cost-currency{
    position:absolute;
    top:50%;
    right:14px;

    transform:translateY(-50%);

    color:#64748b;

    font-size:13px;
    font-weight:900;

    pointer-events:none;
}


/* DOLNY PASEK */

#budget-cost-form .budget-cost-form-actions{
    flex:0 0 auto;

    width:100%;

    padding:15px 20px;

    display:grid;
    grid-template-columns:minmax(150px, 0.7fr) minmax(210px, 1fr);
    justify-content:flex-end;
    gap:10px;

    background:#ffffff;

    border-top:1px solid #dbe3ef;

    box-shadow:
        0 -8px 24px rgba(15,23,42,0.08);
}

#budget-cost-form .budget-cost-form-actions button{
    width:100%;
    min-width:0;
    min-height:50px;

    margin:0;
    padding:11px 16px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    border:none;
    border-radius:13px;

    font-size:14px;
    font-weight:900;

    box-shadow:none;
}

#budget-cost-form .budget-cost-cancel-button{
    background:#e2e8f0 !important;
    color:#334155 !important;
}

#budget-cost-form .budget-cost-cancel-button:hover{
    background:#cbd5e1 !important;
}

#budget-cost-form .budget-cost-save-button{
    background:linear-gradient(
        135deg,
        #2563eb,
        #1d4ed8
    ) !important;

    color:#ffffff !important;

    box-shadow:
        0 8px 18px rgba(37,99,235,0.24) !important;
}

#budget-cost-form .budget-cost-save-button:hover{
    background:linear-gradient(
        135deg,
        #1d4ed8,
        #1e40af
    ) !important;

    box-shadow:
        0 10px 22px rgba(37,99,235,0.30) !important;
}

/* =========================================
   HARMONOGRAM → SZCZEGÓŁY PROJEKTU
   ========================================= */

/*
Panel Harmonogramu pozostaje otwarty,
ale podczas oglądania projektu znajduje się
pod modalem Szczegółów projektu.
*/
#gantt-side-panel-modal.gantt-behind-project-details{
    z-index:100300 !important;
    pointer-events:none !important;
}

#gantt-side-panel.gantt-behind-project-details{
    z-index:100300 !important;
    pointer-events:none !important;
}

/*
Szczegóły projektu muszą znaleźć się
nad panelem Harmonogramu.
*/
#project-details-modal.project-details-opened-from-gantt{
    z-index:100500 !important;
}

/* =========================================
   KLIENCI — KONTAKT GŁÓWNY
   ========================================= */

.client-contact-primary-option{
    margin:16px 0 4px 0;
    padding:14px;

    background:#fffbeb;

    border:1px solid #fde68a;
    border-radius:14px;
}


.client-contact-primary-option > label{
    margin:0 !important;

    display:flex;
    align-items:flex-start;

    gap:10px;

    color:#78350f;

    font-size:14px;
    font-weight:900;

    cursor:pointer;
}


.client-contact-primary-option input{
    flex:0 0 22px;

    width:22px;
    min-width:22px;
    height:22px;

    margin:0;

    accent-color:#f59e0b;

    cursor:pointer;
}


.client-contact-primary-option span{
    line-height:1.4;
}


.client-contact-primary-option small{
    display:block;

    margin:
        8px
        0
        0
        32px;

    color:#92400e;

    font-size:12px;
    line-height:1.45;
}


.client-primary-badge{
    display:inline-flex;
    align-items:center;

    gap:6px;

    padding:6px 9px;

    background:#fef3c7;
    color:#92400e;

    border:1px solid #fde68a;
    border-radius:999px;

    font-size:11px;
    font-weight:900;

    white-space:nowrap;
}


.client-primary-badge.secondary{
    background:#e2e8f0;
    color:#475569;

    border-color:#cbd5e1;
}


.client-contact-primary-row{
    background:#fffbeb;
}


.client-contact-list-name{
    min-width:0;

    display:flex;
    flex-direction:column;

    gap:3px;
}


.client-contact-list-name strong{
    color:#0f172a;

    overflow-wrap:anywhere;
}


.client-contact-list-name small{
    color:#64748b;

    font-size:12px;

    overflow-wrap:anywhere;
}


.client-contact-list-actions{
    display:flex;
    flex-wrap:wrap;

    gap:6px;
}


.client-contact-list-actions button{
    margin:0;
}


.client-contact-list-actions button.danger{
    background:#fee2e2;
    color:#991b1b;
}


.client-contacts-empty{
    min-height:150px;

    padding:22px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:8px;

    text-align:center;

    background:#f8fafc;

    border:1px dashed #cbd5e1;
    border-radius:16px;

    color:#64748b;
}


.client-contacts-empty i{
    font-size:28px;

    color:#94a3b8;
}


.client-contacts-empty strong{
    color:#334155;

    font-size:16px;
}


.client-contacts-empty span{
    max-width:300px;

    font-size:13px;
    line-height:1.45;
}

/* =========================================
   PROJEKT — WYBÓR KONTAKTU
   ========================================= */

.project-contact-help{
    display:block;

    margin:
        -2px
        0
        7px
        0;

    color:#64748b;

    font-size:12px;
    line-height:1.4;
}


#project_contact_person option{
    color:#0f172a;
}

/* =========================================
   PROJEKT — OPISY DAT
   ========================================= */

.project-date-help{
    display:block;

    margin:
        -3px
        0
        8px
        0;

    color:#64748b;

    font-size:12px;
    line-height:1.45;
}

/* =========================================
   POWIADOMIENIA — OTWÓRZ WYDARZENIE
   ========================================= */

.notification-open-button{
    background:#dbeafe;
    color:#1d4ed8;
}

.notification-open-button:hover{
    background:#bfdbfe;
}

/* =========================================
   MOJE KONTO — DANE UŻYTKOWNIKA
   ========================================= */

.account-user-form{
    margin-top:22px;
}

.account-user-form-grid{
    display:grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap:18px;
}

.account-user-field{
    min-width:0;

    display:flex;
    flex-direction:column;
    gap:8px;
}

.account-user-field-wide{
    grid-column:1 / -1;
}

.account-user-field > span{
    color:#334155;

    font-size:13px;
    font-weight:900;

    text-transform:uppercase;
    letter-spacing:0.04em;
}

.account-user-field input{
    width:100%;
    min-width:0;
    height:48px;

    padding:12px 14px;

    box-sizing:border-box;

    border:1px solid #cbd5e1;
    border-radius:13px;

    background:#f8fafc;
    color:#0f172a;

    font-size:15px;

    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
}

.account-user-field input:focus{
    outline:none;

    border-color:#2563eb;
    background:#ffffff;

    box-shadow:
        0 0 0 4px
        rgba(37,99,235,0.12);
}

.account-user-field input[readonly]{
    background:#e2e8f0;
    color:#475569;
    cursor:not-allowed;
}

.account-user-field small{
    color:#64748b;

    font-size:12px;
    line-height:1.45;
}

.account-profile-actions{
    display:flex;
    justify-content:flex-end;

    margin-top:20px;
}

.account-profile-save-button{
    min-height:48px;

    padding:12px 18px;

    border:none;
    border-radius:13px;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #1d4ed8
        ) !important;

    color:#ffffff;

    font-size:14px;
    font-weight:900;

    cursor:pointer;
}

.account-profile-save-button:disabled{
    opacity:0.65;
    cursor:wait;
    transform:none;
}

.account-profile-status{
    min-height:22px;

    margin-top:16px;

    color:#475569;

    font-size:13px;
    font-weight:700;
}

.account-profile-status.is-loading{
    color:#1d4ed8;
}

.account-profile-status.is-success{
    padding:11px 13px;

    border:1px solid #bbf7d0;
    border-radius:12px;

    background:#f0fdf4;
    color:#166534;
}

.account-profile-status.is-error{
    padding:11px 13px;

    border:1px solid #fecaca;
    border-radius:12px;

    background:#fef2f2;
    color:#991b1b;
}

.account-recovery-note{
    display:flex;
    align-items:flex-start;
    gap:14px;

    margin-top:24px;
    padding:18px;

    border:1px solid #c7d2fe;
    border-radius:18px;

    background:
        linear-gradient(
            135deg,
            #eef2ff,
            #eff6ff
        );

    color:#3730a3;
}

.account-recovery-note > i{
    margin-top:2px;

    color:#4f46e5;
    font-size:24px;
}

.account-recovery-note strong{
    display:block;

    margin-bottom:5px;

    color:#312e81;
}

.account-recovery-note span{
    display:block;

    font-size:13px;
    line-height:1.55;
}

/* =========================================
   RESETOWANIE HASŁA
   ========================================= */

.login-forgot-button{
    background:transparent !important;
    color:#2563eb !important;

    border:1px solid transparent !important;

    box-shadow:none !important;

    font-weight:700;
}

.login-forgot-button:hover{
    background:#eff6ff !important;
    border-color:#bfdbfe !important;

    transform:none;
    box-shadow:none !important;
}

.password-reset-box{
    width:460px;
    max-width:92vw;

    padding:26px;

    border-radius:22px;
}

.password-reset-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;

    margin-bottom:22px;
    padding-bottom:16px;

    border-bottom:1px solid #e2e8f0;
}

.password-reset-header h2{
    margin:0 0 7px 0;

    color:#0f172a;
}

.password-reset-header p{
    margin:0;

    color:#64748b;

    font-size:14px;
    line-height:1.5;
}

.password-reset-close{
    width:40px;
    min-width:40px;
    height:40px;

    margin:0 !important;
    padding:0 !important;

    display:flex;
    align-items:center;
    justify-content:center;

    border:none;
    border-radius:11px;

    background:#f1f5f9 !important;
    color:#334155 !important;
}

.password-reset-close i{
    margin:0;
}

.password-reset-field{
    display:flex;
    flex-direction:column;
    gap:8px;

    margin-bottom:16px;
}

.password-reset-field span{
    color:#334155;

    font-size:13px;
    font-weight:900;
}

.password-reset-field input{
    width:100%;
    height:48px;

    box-sizing:border-box;

    padding:12px 14px;

    border:1px solid #cbd5e1;
    border-radius:12px;

    background:#f8fafc;

    font-size:15px;
}

.password-reset-field input:focus{
    outline:none;

    border-color:#2563eb;
    background:#ffffff;

    box-shadow:
        0 0 0 4px
        rgba(37,99,235,0.12);
}

.password-reset-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;

    margin-top:20px;
}

.password-reset-actions button{
    min-height:46px;

    margin:0;
    padding:11px 16px;
}

.password-reset-secondary{
    background:#e2e8f0 !important;
    color:#334155 !important;
}

.password-reset-status{
    min-height:22px;

    margin-top:10px;

    color:#475569;

    font-size:13px;
    font-weight:700;
    line-height:1.45;
}

.password-reset-status.is-loading{
    color:#1d4ed8;
}

.password-reset-status.is-success{
    padding:12px;

    border:1px solid #bbf7d0;
    border-radius:12px;

    background:#f0fdf4;
    color:#166534;
}

.password-reset-status.is-error{
    padding:12px;

    border:1px solid #fecaca;
    border-radius:12px;

    background:#fef2f2;
    color:#991b1b;
}

.password-reset-actions button:disabled{
    opacity:0.65;

    cursor:wait;
    transform:none;
}

/* Modale resetowania hasła — pewne ukrywanie */

#forgot-password-modal[hidden],
#reset-password-modal[hidden]{
    display:none !important;
}

/* =========================================
   KOMUNIKATY BLOKADY LOGOWANIA
   ========================================= */

#login-error{
    width:100%;
    min-height:20px;

    box-sizing:border-box;

    margin:4px 0 0 0;

    font-size:13px;
    font-weight:700;
    line-height:1.45;

    text-align:left;
}

#login-error.is-warning{
    padding:11px 12px;

    border:1px solid #fde68a;
    border-radius:12px;

    background:#fffbeb;
    color:#92400e;
}

#login-error.is-locked{
    padding:11px 12px;

    border:1px solid #fecaca;
    border-radius:12px;

    background:#fef2f2;
    color:#991b1b;
}

#login-error.is-info{
    padding:11px 12px;

    border:1px solid #bfdbfe;
    border-radius:12px;

    background:#eff6ff;
    color:#1e40af;
}

#login-button:disabled{
    opacity:0.6;
    cursor:not-allowed;

    transform:none !important;
    box-shadow:none !important;
}

/* =========================
   ROZWIJANE GRUPY MENU
   ========================= */

.sidebar-group-button{
    position:relative;
}

.sidebar-group-button .menu-text{
    flex:1;
}

.sidebar-group-chevron{
    width:20px;
    min-width:20px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-left:auto;

    color:#94a3b8;

    transition:
        transform 0.2s ease,
        color 0.2s ease;
}

.sidebar-group-chevron i{
    margin-right:0;
    font-size:12px;
}

.sidebar-group-button.is-open{
    background:linear-gradient(
        135deg,
        #475569,
        #334155
    );
}

.sidebar-group-button.is-open
.sidebar-group-chevron{
    transform:rotate(180deg);
    color:#ffffff;
}

.sidebar-tree-submenu{
    position:relative;
}

.sidebar-tree-submenu::before{
    content:"";

    position:absolute;

    top:0;
    bottom:8px;
    left:-13px;

    width:2px;

    border-radius:999px;

    background:
        rgba(
            148,
            163,
            184,
            0.28
        );
}

.sidebar-tree-submenu button{
    position:relative;
}

.sidebar-tree-submenu button::before{
    content:"";

    position:absolute;

    left:-13px;
    top:50%;

    width:10px;
    height:2px;

    background:
        rgba(
            148,
            163,
            184,
            0.28
        );
}

.sidebar-tree-submenu button .menu-icon{
    font-size:15px;
}

.sidebar.collapsed
.sidebar-group-chevron{
    display:none;
}

.sidebar.collapsed
.process-submenu{
    margin-left:0;
}

.sidebar.collapsed
.process-submenu .menu-text{
    display:none;
}

.sidebar.collapsed
.process-submenu button{
    justify-content:center;

    padding-left:0;
    padding-right:0;
}

.sidebar.collapsed
.sidebar-tree-submenu::before,
.sidebar.collapsed
.sidebar-tree-submenu button::before{
    display:none;
}

/* CONNECTOR_SALES_SETTLEMENT_DESKTOP_V1 */

#project-details-modal .connector-settlement-panel{
    position:relative;
    isolation:isolate;

    width:100%;
    min-width:0;

    box-sizing:border-box;

    margin:0 0 22px 0 !important;
    padding:20px !important;

    overflow:hidden;

    border:1px solid #dbe3ef !important;
    border-radius:22px !important;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,0.99),
            rgba(248,250,252,0.98)
        ) !important;

    box-shadow:
        0 12px 30px rgba(15,23,42,0.08),
        0 2px 8px rgba(15,23,42,0.04) !important;
}

#project-details-modal
.connector-settlement-panel::before{
    content:"";

    position:absolute;
    z-index:-1;

    top:0;
    left:22px;
    right:22px;

    height:4px;

    border-radius:0 0 999px 999px;

    background:
        linear-gradient(
            90deg,
            #2563eb,
            #7c3aed,
            #16a34a,
            #f59e0b
        );
}

#project-details-modal
.connector-settlement-header{
    display:flex !important;

    align-items:flex-start !important;
    justify-content:space-between !important;

    gap:18px !important;

    width:100%;
    min-width:0;

    margin:0 0 16px 0 !important;
}

#project-details-modal
.connector-settlement-title{
    margin:0 !important;

    color:#0f172a !important;

    font-size:21px !important;
    line-height:1.25 !important;
    font-weight:900 !important;

    letter-spacing:-0.02em !important;
}

#project-details-modal
.connector-settlement-title i{
    margin-right:8px !important;

    color:#2563eb !important;
}

#project-details-modal
.connector-settlement-subtitle{
    display:block;

    margin:5px 0 0 0 !important;

    color:#64748b !important;

    font-size:13px !important;
    line-height:1.45 !important;
    font-weight:500 !important;
}

#project-details-modal
.connector-settlement-status{
    flex:0 0 auto;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    gap:7px !important;

    max-width:100%;
    min-height:34px;

    margin:0 !important;
    padding:8px 13px !important;

    border:1px solid #bfdbfe !important;
    border-radius:999px !important;

    background:#eff6ff !important;
    color:#1e40af !important;

    font-size:11px !important;
    line-height:1.2 !important;
    font-weight:900 !important;

    letter-spacing:0.03em !important;
    text-transform:uppercase !important;

    white-space:normal !important;
    text-align:center !important;
}

#project-details-modal
.connector-settlement-status
.connector-settlement-status--warning{
    border-color:#fde68a !important;

    background:#fef3c7 !important;
    color:#92400e !important;
}

#project-details-modal
.connector-settlement-status.connector-settlement-status--warning{
    border-color:#fde68a !important;

    background:#fef3c7 !important;
    color:#92400e !important;
}

#project-details-modal
.connector-settlement-status.connector-settlement-status--success{
    border-color:#bbf7d0 !important;

    background:#dcfce7 !important;
    color:#166534 !important;
}

#project-details-modal
.connector-settlement-status.connector-settlement-status--danger{
    border-color:#fecaca !important;

    background:#fee2e2 !important;
    color:#991b1b !important;
}

#project-details-modal
.connector-settlement-grid{
    display:grid !important;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        ) !important;

    gap:14px !important;

    width:100% !important;
    min-width:0 !important;

    margin:0 !important;
}

#project-details-modal
.connector-settlement-card{
    position:relative;

    width:100% !important;
    min-width:0 !important;
    min-height:154px;

    box-sizing:border-box;

    margin:0 !important;
    padding:
        17px
        42px
        16px
        17px
        !important;

    overflow:hidden;

    border:1px solid #dbe3ef !important;
    border-top:4px solid #64748b !important;
    border-radius:17px !important;

    background:#ffffff !important;
    color:#0f172a !important;

    text-align:left !important;

    box-shadow:
        0 6px 18px rgba(15,23,42,0.06),
        0 2px 5px rgba(15,23,42,0.03)
        !important;

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        border-color 0.18s ease !important;
}

#project-details-modal
.connector-settlement-card:hover{
    transform:translateY(-2px) !important;

    box-shadow:
        0 12px 26px rgba(15,23,42,0.10),
        0 3px 8px rgba(15,23,42,0.05)
        !important;
}

#project-details-modal
.connector-settlement-card.connector-settlement-card--sale{
    border-color:#bfdbfe !important;
    border-top-color:#2563eb !important;

    background:
        linear-gradient(
            145deg,
            #eff6ff,
            #ffffff 72%
        ) !important;
}

#project-details-modal
.connector-settlement-card.connector-settlement-card--invoiced{
    border-color:#ddd6fe !important;
    border-top-color:#7c3aed !important;

    background:
        linear-gradient(
            145deg,
            #f5f3ff,
            #ffffff 72%
        ) !important;
}

#project-details-modal
.connector-settlement-card.connector-settlement-card--paid{
    border-color:#bbf7d0 !important;
    border-top-color:#16a34a !important;

    background:
        linear-gradient(
            145deg,
            #f0fdf4,
            #ffffff 72%
        ) !important;
}

#project-details-modal
.connector-settlement-card.connector-settlement-card--remaining{
    border-color:#fde68a !important;
    border-top-color:#f59e0b !important;

    background:
        linear-gradient(
            145deg,
            #fffbeb,
            #ffffff 72%
        ) !important;
}

#project-details-modal
.connector-settlement-card-icon{
    width:40px !important;
    min-width:40px !important;

    height:40px !important;
    min-height:40px !important;

    display:grid !important;

    place-items:center !important;

    margin:0 0 12px 0 !important;
    padding:0 !important;

    border:
        1px solid
        rgba(255,255,255,0.75)
        !important;

    border-radius:13px !important;

    background:#ffffff !important;
    color:#2563eb !important;

    box-shadow:
        0 5px 13px rgba(15,23,42,0.08)
        !important;
}

#project-details-modal
.connector-settlement-card-icon i,

#project-details-modal
.connector-settlement-card-icon svg{
    margin:0 !important;

    color:inherit !important;

    font-size:15px !important;
}

#project-details-modal
.connector-settlement-card--sale
.connector-settlement-card-icon{
    background:#dbeafe !important;
    color:#1d4ed8 !important;
}

#project-details-modal
.connector-settlement-card--invoiced
.connector-settlement-card-icon{
    background:#ede9fe !important;
    color:#6d28d9 !important;
}

#project-details-modal
.connector-settlement-card--paid
.connector-settlement-card-icon{
    background:#dcfce7 !important;
    color:#15803d !important;
}

#project-details-modal
.connector-settlement-card--remaining
.connector-settlement-card-icon{
    background:#fef3c7 !important;
    color:#b45309 !important;
}

#project-details-modal
.connector-settlement-card-label{
    display:block !important;

    margin:0 0 6px 0 !important;

    color:#475569 !important;

    font-size:12px !important;
    line-height:1.3 !important;
    font-weight:900 !important;

    letter-spacing:0.025em !important;
}

#project-details-modal
.connector-settlement-card-value{
    display:block !important;

    margin:0 0 7px 0 !important;

    color:#0f172a !important;

    font-size:25px !important;
    line-height:1.12 !important;
    font-weight:900 !important;

    letter-spacing:-0.035em !important;

    overflow-wrap:anywhere !important;
}

#project-details-modal
.connector-settlement-card-meta{
    display:block !important;

    margin:3px 0 0 0 !important;

    color:#64748b !important;

    font-size:12px !important;
    line-height:1.4 !important;
    font-weight:650 !important;

    overflow-wrap:anywhere !important;
}

#project-details-modal
.connector-settlement-card-arrow{
    position:absolute !important;

    top:20px !important;
    right:16px !important;

    width:24px !important;
    height:24px !important;

    display:grid !important;

    place-items:center !important;

    margin:0 !important;
    padding:0 !important;

    color:#94a3b8 !important;

    font-size:14px !important;

    pointer-events:none !important;
}

#project-details-modal
.connector-settlement-card--sale
.connector-settlement-card-arrow{
    color:#2563eb !important;
}

#project-details-modal
.connector-settlement-card--invoiced
.connector-settlement-card-arrow{
    color:#7c3aed !important;
}

#project-details-modal
.connector-settlement-card--paid
.connector-settlement-card-arrow{
    color:#16a34a !important;
}

#project-details-modal
.connector-settlement-card--remaining
.connector-settlement-card-arrow{
    color:#d97706 !important;
}

@media(max-width:1180px){

    #project-details-modal
    .connector-settlement-grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            )
            !important;
    }
}

/* FINANCIAL_CLOSURE_STAGE4_V2 */
.project-financial-closure-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:15px;
    padding:16px;
    border:1px solid #dbe3ef;
    border-left:5px solid #f59e0b;
    border-radius:15px;
    background:#fffbeb;
}
.project-financial-closure-panel.ready{
    border-left-color:#2563eb;
    background:#eff6ff;
}
.project-financial-closure-panel.closed{
    border-left-color:#16a34a;
    background:#f0fdf4;
}
.project-financial-closure-copy{
    display:flex;
    align-items:flex-start;
    gap:13px;
    min-width:0;
}
.project-financial-closure-icon{
    display:grid;
    width:42px;
    height:42px;
    flex:0 0 42px;
    place-items:center;
    border-radius:13px;
    background:#fef3c7;
    color:#b45309;
}
.project-financial-closure-panel.ready .project-financial-closure-icon{
    background:#dbeafe;
    color:#1d4ed8;
}
.project-financial-closure-panel.closed .project-financial-closure-icon{
    background:#dcfce7;
    color:#15803d;
}
.project-financial-closure-copy strong{
    display:block;
    color:#0f172a;
    font-size:15px;
}
.project-financial-closure-copy p{
    margin:4px 0 0;
    color:#475569;
    font-size:13px;
    line-height:1.45;
}
.project-financial-closure-blockers{
    display:grid;
    gap:5px;
    margin:9px 0 0;
    padding:0;
    list-style:none;
}
.project-financial-closure-blockers:empty{
    display:none;
}
.project-financial-closure-blockers li{
    display:flex;
    align-items:flex-start;
    gap:7px;
    color:#92400e;
    font-size:12px;
    font-weight:700;
}
.project-financial-closure-meta{
    display:block;
    margin-top:8px;
    color:#64748b;
}
.project-financial-closure-actions{
    display:flex;
    flex:0 0 auto;
    gap:9px;
}
.project-financial-closure-actions button{
    margin:0;
    padding:10px 14px;
    border:0;
    border-radius:11px;
    background:#2563eb;
    color:#fff;
    font-weight:900;
    cursor:pointer;
}
.project-financial-closure-actions button.secondary{
    background:#e2e8f0;
    color:#334155;
}
.project-financial-closure-actions button:disabled{
    background:#cbd5e1;
    color:#64748b;
    cursor:not-allowed;
    transform:none;
    box-shadow:none;
}