/**
 * app.css – rozszerzenia i nadpisania responsywne (nawigacja, Katalogi, Dashboard).
 * Nowoczesna kolorystyka i layout – nadpisania zmiennych i rozszerzenia bez zmiany styles.css.
 */

/* ========== Nowoczesna kolorystyka (nadpisanie zmiennych z styles.css) ========== */
:root {
    --bg: #0f1419;
    --panel: #161b22;
    --panel-2: #21262d;
    --card: rgba(22, 27, 34, 0.85);
    --muted: #8b949e;
    --text: #e6edf3;
    --brand: #58a6ff;
    --accent: #3fb950;
    --danger: #f85149;
    --border: #30363d;
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    --radius: 10px;
    --nav-accent: #58a6ff;
    --nav-accent-dim: rgba(88, 166, 255, 0.18);
    /* Lewy sidebar nawigacji (CRM, Projekty, Raporty, itd.) – styl jak na screenie */
    --sidebar-bg: #1B2026;
    --sidebar-heading: #9BB6CF;
    --sidebar-item-bg: #2C313B;
    --sidebar-item-active-bg: #293A53;
    --sidebar-item-active-border: #597399;
    --sidebar-item-text: #F0F0F0;
    --sidebar-item-radius: 8px;
}

/* Tło aplikacji – prosty, nowoczesny */
body {
    background: var(--bg);
}
body.bg-decor {
    background: linear-gradient(180deg, var(--bg) 0%, #0d1117 100%);
}
.bg-decor::before,
.bg-decor::after {
    opacity: 0.12;
}
.bg-decor::before {
    background: radial-gradient(circle at 30% 30%, var(--brand) 0, transparent 55%);
}
.bg-decor::after {
    background: radial-gradient(circle at 70% 70%, var(--accent) 0, transparent 55%);
}

/* Shell – spójne tło */
.app-shell {
    background: var(--bg);
}

/* Karty – delikatniejsze ramki i cień */
.card-surface {
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}

/* Header – jednolite tło, subtelna dolna krawędź */
.app-header.navbar,
.app-header {
    background: var(--panel);
    border-bottom: 1px solid var(--border);
    backdrop-filter: saturate(120%) blur(12px);
}

/* Sidebar – spójna ramka i cień */
.sidebar {
    background: var(--panel);
    border-right: 1px solid var(--border);
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);
}

/* ========== Spójność kolorystyczna – nawigacja główna (desktop) ========== */
.app-header .view-toggle-btn {
    color: var(--text);
}
.app-header .view-toggle-btn:not(.active):hover {
    background: var(--panel-2);
}
.app-header .view-toggle-btn.active {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: inset 2px 0 0 var(--text);
}

/* Etykiety zakładek głównej nawigacji zawsze widoczne (desktop i mobile) */
.app-header .view-toggle-btn .view-toggle-label {
    display: inline-block;
    white-space: nowrap;
    opacity: 1;
    margin-left: 0.35rem;
}

/* ========== Spójność kolorystyczna – sidebary sekcji (CRM, Raporty, Katalog, Firma, Kontrahenci, HR, Księgowość, Integracje, Projekty) ========== */
.crm-nav-sidebar .crm-nav-section,
.crm-nav-sidebar .nav-section-header,
.reports-nav-sidebar .nav-section-header,
.catalog-nav-sidebar .catalog-nav-group-header,
.catalog-nav-sidebar .nav-section-header,
.contractors-nav-sidebar .nav-section-header,
.accounting-nav-sidebar .nav-section-header,
.hr-nav-sidebar .nav-section-header,
.company-nav-sidebar .nav-section-header,
.integrations-nav-sidebar .nav-section-header,
.projects-nav-sidebar .nav-section-header,
.employee-panel-sidebar .nav-section-header {
    color: var(--sidebar-heading) !important;
    font-size: 0.75rem !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.75rem 0.5rem 0.5rem !important;
}
.crm-nav-sidebar .nav-section-header.mt-1,
.reports-nav-sidebar .nav-section-header.mt-1,
.catalog-nav-sidebar .nav-section-header.mt-1,
.contractors-nav-sidebar .nav-section-header.mt-1,
.accounting-nav-sidebar .nav-section-header.mt-1,
.hr-nav-sidebar .nav-section-header.mt-1,
.company-nav-sidebar .nav-section-header.mt-1,
.integrations-nav-sidebar .nav-section-header.mt-1,
.projects-nav-sidebar .nav-section-header.mt-1,
.employee-panel-sidebar .nav-section-header.mt-1 {
    margin-top: 0.5rem;
}
.crm-nav-sidebar .list-group-item,
.reports-nav-sidebar .list-group-item,
.catalog-nav-sidebar .list-group-item,
.contractors-nav-sidebar .list-group-item,
.accounting-nav-sidebar .list-group-item,
.hr-nav-sidebar .list-group-item,
.company-nav-sidebar .list-group-item,
.integrations-nav-sidebar .list-group-item,
.projects-nav-sidebar .list-group-item,
.employee-panel-sidebar .list-group-item {
    color: var(--sidebar-item-text);
    border: 1px solid transparent;
    border-radius: var(--sidebar-item-radius);
    background: var(--sidebar-item-bg);
    margin-bottom: 6px;
    padding: 0.5rem 0.75rem;
}
.crm-nav-sidebar .list-group-item:last-child,
.reports-nav-sidebar .list-group-item:last-child,
.catalog-nav-sidebar .list-group-item:last-child,
.contractors-nav-sidebar .list-group-item:last-child,
.accounting-nav-sidebar .list-group-item:last-child,
.hr-nav-sidebar .list-group-item:last-child,
.company-nav-sidebar .list-group-item:last-child,
.integrations-nav-sidebar .list-group-item:last-child,
.projects-nav-sidebar .list-group-item:last-child,
.employee-panel-sidebar .list-group-item:last-child {
    margin-bottom: 0;
}
.crm-nav-sidebar .list-group-item:hover,
.reports-nav-sidebar .list-group-item:hover,
.catalog-nav-sidebar .list-group-item:hover,
.contractors-nav-sidebar .list-group-item:hover,
.accounting-nav-sidebar .list-group-item:hover,
.hr-nav-sidebar .list-group-item:hover,
.company-nav-sidebar .list-group-item:hover,
.integrations-nav-sidebar .list-group-item:hover,
.projects-nav-sidebar .list-group-item:hover,
.employee-panel-sidebar .list-group-item:hover {
    background: #353b45;
    border-color: transparent;
    color: var(--sidebar-item-text);
}
.crm-nav-sidebar .list-group-item.active,
.reports-nav-sidebar .list-group-item.active,
.catalog-nav-sidebar .list-group-item.active,
.contractors-nav-sidebar .list-group-item.active,
.accounting-nav-sidebar .list-group-item.active,
.hr-nav-sidebar .list-group-item.active,
.company-nav-sidebar .list-group-item.active,
.integrations-nav-sidebar .list-group-item.active,
.projects-nav-sidebar .list-group-item.active,
.employee-panel-sidebar .list-group-item.active {
    background: var(--sidebar-item-active-bg);
    border: 1px solid var(--sidebar-item-active-border);
    box-shadow: none;
    color: var(--sidebar-item-text);
}
.crm-nav-sidebar .list-group-item.active i,
.reports-nav-sidebar .list-group-item.active i,
.catalog-nav-sidebar .list-group-item.active i,
.contractors-nav-sidebar .list-group-item.active i,
.accounting-nav-sidebar .list-group-item.active i,
.hr-nav-sidebar .list-group-item.active i,
.company-nav-sidebar .list-group-item.active i,
.integrations-nav-sidebar .list-group-item.active i,
.projects-nav-sidebar .list-group-item.active i,
.employee-panel-sidebar .list-group-item.active i {
    color: var(--sidebar-item-text);
}
.crm-nav-sidebar .list-group-item i,
.reports-nav-sidebar .list-group-item i,
.catalog-nav-sidebar .list-group-item i,
.contractors-nav-sidebar .list-group-item i,
.accounting-nav-sidebar .list-group-item i,
.hr-nav-sidebar .list-group-item i,
.company-nav-sidebar .list-group-item i,
.integrations-nav-sidebar .list-group-item i,
.projects-nav-sidebar .list-group-item i,
.employee-panel-sidebar .list-group-item i {
    color: rgba(255, 255, 255, 0.85);
}

/* Wszystkie sidebary sekcji – jednolite tło (nadpisuje inline style) */
.reports-nav-sidebar,
.catalog-nav-sidebar,
.contractors-nav-sidebar,
.accounting-nav-sidebar,
.hr-nav-sidebar,
.company-nav-sidebar,
.integrations-nav-sidebar {
    background: var(--sidebar-bg) !important;
}

/* ========== Moduł Projekty – layout, sidebar, sekcje, lista ========== */
#projectsWrapper,
.projects-nav-container {
    overflow-x: hidden;
}
.projects-nav-row {
    gap: 0;
}
.projects-nav-sidebar {
    width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.projects-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
}
.projects-nav-inner {
    padding: 0.5rem;
}
.projects-nav-inner .list-group {
    margin: 0;
}
.projects-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
.projects-nav-footer-link {
    opacity: 0.7;
}
.projects-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    overflow-x: hidden;
    transition: margin-left 0.2s ease, width 0.2s ease;
}

/* Stan zwinięty sidebara Projektów – tylko na mobile (wersja webowa = sidebar zawsze widoczny) */
@media (max-width: 991.98px) {
    .projects-nav-container.projects-sidebar-collapsed .projects-nav-sidebar {
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border-right-width: 0;
        transition: width 0.2s ease, min-width 0.2s ease;
    }
    .projects-nav-container.projects-sidebar-collapsed .projects-content-area {
        margin-left: 0;
        width: 100%;
    }
}

/* Backdrop dla sidebara Projektów (mobile) */
.projects-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
.projects-nav-item {
    color: var(--sidebar-item-text);
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}
.projects-nav-item:hover {
    color: var(--sidebar-item-text);
    text-decoration: none;
}
.projects-nav-item.active {
    background: var(--sidebar-item-active-bg) !important;
    border-color: var(--sidebar-item-active-border) !important;
    box-shadow: none;
}
.projects-nav-item.active i {
    color: var(--sidebar-item-text);
}
.projects-nav-item i {
    color: rgba(255, 255, 255, 0.85);
}
.projects-nav-item .projects-nav-label {
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: width 0.2s ease, opacity 0.2s ease;
}
.projects-nav-item.active .projects-nav-label {
    width: auto;
    opacity: 1;
}

/* ========== Raporty – layout jak CRM/Projekty (sidebar 250px, mobile drawer + backdrop) ========== */
/* Jedna scrollbar (zewnętrzna): treść się rozciąga, przewija cała strona */
#reportsWrapper {
    min-height: calc(100vh - 64px - 2rem);
    height: auto;
    overflow: visible;
    display: block;
}
.reports-container {
    display: block;
    overflow: visible;
}
@media (max-width: 991.98px) {
    #reportsWrapper {
        min-height: calc(100vh - 64px - 2rem);
        height: auto;
        overflow: visible;
    }
    #reportsWrapper .reports-nav-row {
        flex-wrap: nowrap;
    }
    #reportsWrapper .reports-content-area {
        width: 100%;
        overflow-x: hidden;
        overflow-y: visible;
        max-height: none;
    }
}
.reports-nav-container {
    --reports-nav-lg: 992px; /* Bootstrap lg breakpoint */
    width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    display: flex;
    flex-direction: column;
}
.reports-nav-row {
    gap: 0;
    display: flex;
    min-width: 0;
}
.reports-nav-sidebar {
    width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.reports-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
}
.reports-nav-inner {
    padding: 0.5rem;
}
.reports-nav-inner .list-group {
    margin: 0;
}
.reports-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
.reports-nav-footer-link {
    opacity: 0.7;
}
.reports-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    transition: margin-left 0.2s ease, width 0.2s ease;
    padding-bottom: 3rem;
    box-sizing: border-box;
}
/* Bootstrap lg (992px): poniżej sidebar mobilny */
@media (max-width: 991.98px) {
    .reports-nav-container.reports-sidebar-collapsed .reports-nav-sidebar {
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border-right-width: 0;
        transition: width 0.2s ease, min-width 0.2s ease;
    }
    .reports-nav-container.reports-sidebar-collapsed .reports-content-area {
        margin-left: 0;
        width: 100%;
    }
}
.reports-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
/* Bootstrap lg: poniżej sidebar jako overlay */
@media (max-width: 991.98px) {
    .reports-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
    }
    .reports-nav-container:not(.reports-sidebar-collapsed) .reports-nav-sidebar {
        transform: translateX(0);
    }
    .reports-nav-container:not(.reports-sidebar-collapsed) .reports-nav-backdrop {
        display: block;
    }
    .reports-nav-row {
        flex-wrap: nowrap;
    }
    .reports-content-area {
        margin-left: 0;
        width: 100%;
        min-width: 0;
    }
}
.reports-nav-item .reports-nav-label {
    display: inline-block;
    white-space: nowrap;
    margin-left: 0.35rem;
    color: inherit;
    max-width: none;
    opacity: 1;
}

/* ========== Nawigacja Finanse (modules/accounting) – desktop + mobile ========== */
.accounting-nav-container {
    width: 100%;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}
.accounting-nav-row {
    gap: 0;
    display: flex;
    min-width: 0;
}
.accounting-nav-sidebar {
    width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
@media (min-width: 992px) {
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-sidebar {
        width: 58px;
        min-width: 58px;
        overflow-x: hidden;
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-sidebar .accounting-nav-label {
        display: inline-block;
        max-width: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        opacity: 0;
        padding: 0 !important;
        margin: 0 !important;
        white-space: nowrap;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-sidebar .nav-section-header {
        display: none !important;
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-sidebar .accounting-nav-item {
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        flex-wrap: nowrap;
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-sidebar .accounting-nav-item i {
        margin-right: 0 !important;
        flex-shrink: 0;
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-content-area {
        margin-left: 58px;
        width: calc(100% - 58px);
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-sidebar {
        width: 250px;
        min-width: 250px;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-sidebar .accounting-nav-label {
        max-width: none !important;
        width: auto !important;
        min-width: 0;
        opacity: 1;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0.35rem !important;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-sidebar .nav-section-header {
        display: block !important;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-sidebar .accounting-nav-item {
        justify-content: flex-start;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-sidebar .accounting-nav-item i {
        margin-right: 0.35rem !important;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-content-area {
        margin-left: 250px;
        width: calc(100% - 250px);
    }
    .accounting-nav-container.accounting-sidebar-icons-only .accounting-nav-footer .small {
        overflow: hidden;
        max-width: 0;
        opacity: 0;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .accounting-nav-container.accounting-sidebar-icons-only.accounting-sidebar-expanded .accounting-nav-footer .small {
        max-width: 300px;
        opacity: 1;
    }
}
.accounting-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
}
.accounting-nav-inner .list-group {
    margin: 0;
}
.accounting-nav-inner {
    overflow-x: hidden;
}
.accounting-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
/* Wspólny styl stopki menu – Finanse, HR, CRM, Projekty, Raporty, Katalogi, Firma, Kontrahenci, Integracje */
.accounting-nav-footer.sidebar-nav-footer,
.hr-nav-footer.sidebar-nav-footer,
.crm-nav-footer.sidebar-nav-footer,
.projects-nav-footer,
.reports-nav-footer,
.sidebar .sidebar-footer,
.company-nav-sidebar .company-nav-footer,
.catalog-nav-sidebar .catalog-nav-footer,
.contractors-nav-sidebar .contractors-nav-footer,
.integrations-nav-sidebar .integrations-nav-footer {
    background: var(--panel-2) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 0 var(--radius) var(--radius);
}
.accounting-nav-footer.sidebar-nav-footer .small,
.hr-nav-footer.sidebar-nav-footer .small,
.crm-nav-footer.sidebar-nav-footer .small,
.projects-nav-footer .small,
.reports-nav-footer .small,
.sidebar .sidebar-footer .small,
.sidebar .sidebar-footer .sidebar-footer-links,
.company-nav-sidebar .company-nav-footer .small,
.catalog-nav-sidebar .catalog-nav-footer .small,
.contractors-nav-sidebar .contractors-nav-footer .small,
.integrations-nav-sidebar .integrations-nav-footer .small,
.accounting-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link,
.hr-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link,
.crm-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link,
.projects-nav-footer .projects-nav-footer-link,
.projects-nav-footer a,
.reports-nav-footer .reports-nav-footer-link,
.reports-nav-footer a,
.sidebar .sidebar-footer a,
.company-nav-sidebar .company-nav-footer a,
.catalog-nav-sidebar .catalog-nav-footer a,
.contractors-nav-sidebar .contractors-nav-footer a,
.integrations-nav-sidebar .integrations-nav-footer a {
    color: #8b949e !important;
    opacity: 0.95;
    text-decoration: none;
    transition: opacity 0.2s ease, color 0.2s ease;
}
.accounting-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link:hover,
.hr-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link:hover,
.crm-nav-footer.sidebar-nav-footer .sidebar-nav-footer-link:hover,
.projects-nav-footer a:hover,
.reports-nav-footer a:hover,
.sidebar .sidebar-footer a:hover,
.company-nav-sidebar .company-nav-footer a:hover,
.catalog-nav-sidebar .catalog-nav-footer a:hover,
.contractors-nav-sidebar .contractors-nav-footer a:hover,
.integrations-nav-sidebar .integrations-nav-footer a:hover {
    opacity: 1;
    color: #a0aab5 !important;
}
.sidebar-nav-footer-link i,
.projects-nav-footer a i,
.reports-nav-footer a i {
    color: inherit;
}
.accounting-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    transition: margin-left 0.2s ease, width 0.2s ease;
    padding-bottom: 3rem;
    box-sizing: border-box;
}
@media (max-width: 991.98px) {
    .accounting-nav-container.accounting-sidebar-collapsed .accounting-nav-sidebar {
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border-right-width: 0;
        transition: width 0.2s ease, min-width 0.2s ease;
    }
    .accounting-nav-container.accounting-sidebar-collapsed .accounting-content-area {
        margin-left: 0;
        width: 100%;
    }
}
.accounting-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
@media (max-width: 991.98px) {
    .accounting-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
    }
    .accounting-nav-container:not(.accounting-sidebar-collapsed) .accounting-nav-sidebar {
        transform: translateX(0);
    }
    .accounting-nav-container:not(.accounting-sidebar-collapsed) .accounting-nav-backdrop {
        display: block;
    }
    .accounting-nav-row {
        flex-wrap: nowrap;
    }
    .accounting-content-area {
        margin-left: 0;
        width: 100%;
        min-width: 0;
    }
}
.accounting-nav-item {
    color: var(--sidebar-item-text);
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}
.accounting-nav-item:hover {
    color: var(--sidebar-item-text);
    text-decoration: none;
}
.accounting-nav-item.active {
    background: var(--sidebar-item-active-bg) !important;
    border-color: var(--sidebar-item-active-border) !important;
    box-shadow: none;
}
.accounting-nav-item.active i {
    color: var(--sidebar-item-text);
}
.accounting-nav-item i {
    color: rgba(255, 255, 255, 0.85);
}
.accounting-nav-item .accounting-nav-label {
    display: inline-block;
    white-space: nowrap;
    margin-left: 0.35rem;
    color: inherit;
    max-width: none;
    opacity: 1;
}
.accounting-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}

/* ========== HR Nawigacja (modules/hr) – sidebar ikonki + animacja tekstu ========== */
.hr-nav-container {
    width: 100%;
    overflow-x: hidden;
}
.hr-nav-sidebar {
    width: 250px;
    min-width: 250px;
    flex-shrink: 0;
    background: var(--panel);
    background: linear-gradient(180deg, var(--panel), var(--panel-2));
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.hr-nav-sidebar .hr-nav-label {
    display: inline-block;
    white-space: nowrap;
    margin-left: 0.35rem;
    max-width: none;
    opacity: 1;
}
.hr-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    overflow-x: hidden;
    transition: margin-left 0.2s ease, width 0.2s ease;
}
.hr-nav-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}
.hr-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
@media (min-width: 992px) {
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-sidebar {
        width: 58px;
        min-width: 58px;
        overflow-x: hidden;
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-sidebar .hr-nav-label {
        display: inline-block;
        max-width: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        opacity: 0;
        padding: 0 !important;
        margin: 0 !important;
        white-space: nowrap;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-sidebar .nav-section-header {
        display: none !important;
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-sidebar .hr-nav-item {
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-sidebar .hr-nav-item i {
        margin-right: 0 !important;
        flex-shrink: 0;
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-content-area {
        margin-left: 58px;
        width: calc(100% - 58px);
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-sidebar {
        width: 250px;
        min-width: 250px;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-sidebar .hr-nav-label {
        max-width: none !important;
        width: auto !important;
        opacity: 1;
        margin-left: 0.35rem !important;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-sidebar .nav-section-header {
        display: block !important;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-sidebar .hr-nav-item {
        justify-content: flex-start;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-sidebar .hr-nav-item i {
        margin-right: 0.35rem !important;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-content-area {
        margin-left: 250px;
        width: calc(100% - 250px);
    }
    .hr-nav-container.hr-sidebar-icons-only .hr-nav-footer .small {
        overflow: hidden;
        max-width: 0;
        opacity: 0;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .hr-nav-container.hr-sidebar-icons-only.hr-sidebar-expanded .hr-nav-footer .small {
        max-width: 300px;
        opacity: 1;
    }
}
@media (max-width: 991.98px) {
    .hr-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
    }
    .hr-nav-container.hr-sidebar-collapsed .hr-nav-sidebar {
        transform: translateX(-100%);
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border: none;
    }
    .hr-nav-container:not(.hr-sidebar-collapsed) .hr-nav-sidebar {
        transform: translateX(0);
    }
    .hr-content-area {
        margin-left: 0;
        width: 100%;
    }
    .hr-nav-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        top: 64px;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.4);
        z-index: 1035;
    }
    .hr-nav-container:not(.hr-sidebar-collapsed) .hr-nav-backdrop {
        display: block;
    }
}

/* ========== Katalog – sidebar (modules/catalog), ikonki + rozwijanie z tekstem ========== */
.catalog-nav-container {
    width: 100%;
    overflow-x: hidden;
}
.catalog-nav-row {
    gap: 0;
    min-height: calc(100vh - 64px);
    min-width: 0;
}
.catalog-nav-sidebar {
    width: 250px;
    min-width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.catalog-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
}
.catalog-nav-inner {
    padding: 0.5rem;
}
.catalog-nav-inner .list-group {
    margin: 0;
}
.catalog-nav-sidebar .catalog-nav-label {
    display: inline-block;
    white-space: nowrap;
    margin-left: 0.35rem;
    max-width: none;
    opacity: 1;
}
.catalog-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    overflow-x: hidden;
    transition: margin-left 0.2s ease, width 0.2s ease;
}
.catalog-nav-view.catalog-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}
.catalog-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
@media (min-width: 992px) {
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-sidebar {
        width: 58px;
        min-width: 58px;
        overflow-x: hidden;
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-sidebar .catalog-nav-label {
        display: inline-block;
        max-width: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        opacity: 0;
        padding: 0 !important;
        margin: 0 !important;
        white-space: nowrap;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-sidebar .nav-section-header {
        display: none !important;
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-sidebar .catalog-nav-item {
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-sidebar .catalog-nav-item i {
        margin-right: 0 !important;
        flex-shrink: 0;
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-content-area {
        margin-left: 58px;
        width: calc(100% - 58px);
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-sidebar {
        width: 250px;
        min-width: 250px;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-sidebar .catalog-nav-label {
        max-width: none !important;
        width: auto !important;
        opacity: 1;
        margin-left: 0.35rem !important;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-sidebar .nav-section-header {
        display: block !important;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-sidebar .catalog-nav-item {
        justify-content: flex-start;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-sidebar .catalog-nav-item i {
        margin-right: 0.35rem !important;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-content-area {
        margin-left: 250px;
        width: calc(100% - 250px);
    }
    .catalog-nav-container.catalog-sidebar-icons-only .catalog-nav-footer .small {
        overflow: hidden;
        max-width: 0;
        opacity: 0;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .catalog-nav-container.catalog-sidebar-icons-only.catalog-sidebar-expanded .catalog-nav-footer .small {
        max-width: 300px;
        opacity: 1;
    }
}
@media (max-width: 991.98px) {
    .catalog-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
    }
    .catalog-nav-container.catalog-sidebar-collapsed .catalog-nav-sidebar {
        transform: translateX(-100%);
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border: none;
    }
    .catalog-nav-container:not(.catalog-sidebar-collapsed) .catalog-nav-sidebar {
        transform: translateX(0);
    }
    .catalog-content-area {
        margin-left: 0;
        width: 100%;
    }
    .catalog-nav-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        top: 64px;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.4);
        z-index: 1035;
    }
    .catalog-nav-container:not(.catalog-sidebar-collapsed) .catalog-nav-backdrop {
        display: block;
    }
}

/* Sekcje w widoku Katalog (szare boxy) */
.catalog-section-box {
    background: var(--panel-2);
    border-radius: var(--radius, 0.375rem);
    padding: 1rem;
    margin-bottom: 0.5rem;
}

/* ========== Katalog produktów (modules/catalog_products) – boxy i tabela responsywna ========== */
.products-catalog-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
}
.products-catalog-module .reports-section-box .card-body,
.products-catalog-module .reports-section-box .card-body h2,
.products-catalog-module .reports-section-box .card-body h5,
.products-catalog-module .reports-section-box .card-body h6 {
    color: var(--text) !important;
}
.products-catalog-module .reports-section-box .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.products-catalog-module .reports-section-box .form-label {
    color: var(--text) !important;
}
.products-catalog-module .reports-section-box .text-muted {
    color: var(--muted) !important;
}
@media (max-width: 767.98px) {
    .products-catalog-module .reports-section-box .table-responsive {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
    }
}

/* ========== Szablony ofert (catalog_templates) – szare boxy, tabela responsywna ========== */
.catalog-templates-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
}
.catalog-templates-module .reports-section-box .card-body,
.catalog-templates-module .reports-section-box .card-body h2,
.catalog-templates-module .reports-section-box .card-body h5,
.catalog-templates-module .reports-section-box .card-body h6 {
    color: var(--text) !important;
}
.catalog-templates-module .reports-section-box .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.catalog-templates-module .reports-section-box .form-label {
    color: var(--text) !important;
}
.catalog-templates-module .reports-section-box .text-muted {
    color: var(--muted) !important;
}
@media (max-width: 767.98px) {
    .catalog-templates-module .reports-section-box .table-responsive {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
    }
}

/* ========== Zamówienia w Katalogu (modules/catalog_orders) ========== */
.catalog-orders-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.catalog-orders-module .reports-section-box .card-body,
.catalog-orders-module .reports-section-box .card-body h2,
.catalog-orders-module .reports-section-box .card-body h5,
.catalog-orders-module .reports-section-box .card-body h6 {
    color: var(--text) !important;
}
.catalog-orders-module .reports-section-box .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.catalog-orders-module .reports-section-box .form-label,
.catalog-orders-module .reports-section-box .text-muted {
    color: var(--text) !important;
}
.catalog-orders-module .reports-section-box .text-muted {
    color: var(--muted) !important;
}
.catalog-orders-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
}
.catalog-orders-tabs .nav-link .catalog-orders-tab-label {
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.2s ease, max-width 0.25s ease;
}
.catalog-orders-tabs .nav-link.active .catalog-orders-tab-label {
    opacity: 1;
    max-width: 120px;
    overflow: visible;
}
.catalog-orders-module .catalog-orders-tabs .nav-link {
    color: var(--text);
}
.catalog-orders-module .catalog-orders-tabs .nav-link.active {
    color: var(--text);
}
@media (max-width: 767.98px) {
    .catalog-orders-module .reports-section-box .table-responsive {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
    }
}

/* ========== Integracje – sidebar (modules/integrations), ikonki + rozwijanie z tekstem ========== */
.integrations-nav-container {
    width: 100%;
    overflow-x: hidden;
}
.integrations-nav-sidebar {
    width: 250px;
    min-width: 250px;
    flex-shrink: 0;
    background: linear-gradient(180deg, var(--panel), var(--panel-2));
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.integrations-nav-sidebar .integrations-nav-label {
    display: inline-block;
    white-space: nowrap;
    margin-left: 0.35rem;
    max-width: none;
    opacity: 1;
}
.integrations-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    overflow-x: hidden;
    transition: margin-left 0.2s ease, width 0.2s ease;
}
.integrations-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}
.integrations-nav-item {
    color: var(--text);
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}
.integrations-nav-item:hover {
    color: var(--text);
    text-decoration: none;
}
.integrations-nav-item.active {
    background: rgba(122, 162, 255, 0.12) !important;
    border-color: rgba(122, 162, 255, 0.4) !important;
}
.integrations-nav-item.active i {
    color: #7aa2ff;
}
.integrations-nav-item i {
    color: rgba(255, 255, 255, 0.7);
}
.integrations-nav-item:hover i {
    color: #9ec5fe;
}
@media (min-width: 992px) {
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-nav-sidebar {
        width: 58px;
        min-width: 58px;
        overflow-x: hidden;
    }
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-nav-sidebar .integrations-nav-label {
        display: inline-block;
        max-width: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        opacity: 0;
        padding: 0 !important;
        margin: 0 !important;
        white-space: nowrap;
        transition: max-width 0.2s ease, opacity 0.2s ease;
    }
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-nav-sidebar .nav-section-header {
        display: none !important;
    }
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-nav-sidebar .integrations-nav-item {
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-nav-sidebar .integrations-nav-item i {
        margin-right: 0 !important;
        flex-shrink: 0;
    }
    .integrations-nav-container.integrations-sidebar-icons-only .integrations-content-area {
        margin-left: 58px;
        width: calc(100% - 58px);
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-nav-sidebar {
        width: 250px;
        min-width: 250px;
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-nav-sidebar .integrations-nav-label {
        max-width: none !important;
        width: auto !important;
        opacity: 1;
        margin-left: 0.35rem !important;
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-nav-sidebar .nav-section-header {
        display: block !important;
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-nav-sidebar .integrations-nav-item {
        justify-content: flex-start;
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-nav-sidebar .integrations-nav-item i {
        margin-right: 0.35rem !important;
    }
    .integrations-nav-container.integrations-sidebar-icons-only.integrations-sidebar-expanded .integrations-content-area {
        margin-left: 250px;
        width: calc(100% - 250px);
    }
}
@media (max-width: 991.98px) {
    .integrations-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
    }
    .integrations-nav-container.integrations-sidebar-collapsed .integrations-nav-sidebar {
        transform: translateX(-100%);
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border: none;
    }
    .integrations-nav-container:not(.integrations-sidebar-collapsed) .integrations-nav-sidebar {
        transform: translateX(0);
    }
    .integrations-content-area {
        margin-left: 0;
        width: 100%;
    }
    .integrations-nav-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        top: 64px;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.4);
        z-index: 1035;
        cursor: pointer;
    }
    .integrations-nav-container:not(.integrations-sidebar-collapsed) .integrations-nav-backdrop {
        display: block;
    }
}
.integrations-jira-module .reports-section-box.card-surface,
.integrations-tempo-module .reports-section-box.card-surface,
.integrations-jira-module .reports-section-box.card-surface,
.integrations-tempo-module .reports-section-box.card-surface,
.integrations-jira-filters-module .reports-section-box.card-surface,
.integrations-jira-logs-module .reports-section-box.card-surface,
.integrations-tempo-logs-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
/* Nagłówki grup w liście filtrów – czytelny kontrast na ciemnym tle */
.integrations-jira-filters-module .integrations-jira-filters-group-header,
.integrations-jira-filters-module .integrations-jira-filters-group-header h6,
.integrations-jira-filters-module .integrations-jira-filters-group-header .badge {
    color: #fff !important;
}
.integrations-jira-filters-module .integrations-jira-filters-group-header .badge.bg-secondary {
    background-color: rgba(255, 255, 255, 0.25) !important;
    color: #fff !important;
}
.integrations-jira-module .integrations-jira-table th.w-180,
.integrations-tempo-module .integrations-tempo-table th.w-180 {
    width: 180px;
}
/* Mapowanie użytkowników Jira: pola 30% / 30% / 40%, guziki pod spodem po prawej */
.integrations-jira-module .jira-user-map-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.integrations-jira-module .jira-user-map-form > .jira-user-map-col-30 {
    flex: 0 0 30%;
    min-width: 0;
}
.integrations-jira-module .jira-user-map-form > .jira-user-map-col-40 {
    flex: 0 0 40%;
    min-width: 0;
}
.integrations-jira-module .jira-user-map-form > .jira-user-map-col-40 .input-group .form-control {
    min-width: 0;
}
@media (max-width: 991.98px) {
    .integrations-jira-module .jira-user-map-form > .jira-user-map-col-30,
    .integrations-jira-module .jira-user-map-form > .jira-user-map-col-40 {
        flex: 0 0 100%;
    }
}
@media (max-width: 767.98px) {
    .integrations-jira-module .integrations-jira-table thead th,
    .integrations-jira-module .integrations-jira-table tbody td,
    .integrations-tempo-module .integrations-tempo-table thead th,
    .integrations-tempo-module .integrations-tempo-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
}

/* Token w jednym rzędzie z ikonką (pole edycji) */
.integrations-jira-token-input-group,
.integrations-tempo-token-input-group {
    max-width: 100%;
}
.integrations-jira-token-input-group .form-control,
.integrations-tempo-token-input-group .form-control {
    min-width: 0;
    max-width: 100%;
}

/* Moduł Role (hr_roles) – tabela responsywna */
.hr-roles-table {
    min-width: 500px;
}
@media (max-width: 767.98px) {
    .hr-roles-table thead th,
    .hr-roles-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
}

/* ========== HR Lista pracowników (modules/hr_employees) – tabela responsywna, sekcje w boxach ========== */
.hr-employees-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
.hr-employees-module .hr-employees-list-table {
    min-width: 0;
}
.hr-employees-module .hr-employees-list-table thead th,
.hr-employees-module .hr-employees-list-table tbody td {
    padding: 0.5rem 0.5rem;
    font-size: 0.875rem;
    vertical-align: middle;
}
@media (max-width: 767.98px) {
    .hr-employees-module .hr-employees-list-table thead th,
    .hr-employees-module .hr-employees-list-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
    .hr-employees-module .hr-employees-list-table .table-group-header td {
        font-size: 0.75rem;
        padding: 0.35rem 0.35rem;
    }
}

/* ========== HR Zespoły (modules/hr_teams) – ten sam odcień boxów co w Role (reports-section-box) ========== */
.hr-teams-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
.hr-teams-module .teams-dept-card.card-surface,
.hr-teams-module .teams-team-card.card-surface,
.hr-teams-module .teams-dept-card,
.hr-teams-module .teams-team-card {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
/* Nagłówki kart – ten sam styl co card-header w Role */
.hr-teams-module .teams-dept-header {
    background: rgba(255, 255, 255, 0.04) !important;
    border-bottom: 1px solid var(--border);
}
.hr-teams-module .teams-team-header {
    background: transparent !important;
    border-bottom: 1px solid var(--border);
}
.hr-teams-module .teams-teams-list,
.hr-teams-module .teams-members-list {
    background: transparent !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.hr-teams-module .teams-dept-card,
.hr-teams-module .teams-team-card {
    border-color: var(--border) !important;
    box-shadow: none !important;
}
.hr-teams-module .teams-dept-card::before,
.hr-teams-module .teams-dept-card::after,
.hr-teams-module .teams-team-card::before,
.hr-teams-module .teams-team-card::after {
    display: none !important;
}
.hr-teams-module .teams-dept-card:hover,
.hr-teams-module .teams-team-card:hover {
    background: var(--panel-2) !important;
    border-color: var(--border) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}
/* Ikony departamentu/zespołu – niebieskie */
.hr-teams-module .teams-dept-icon {
    background: rgba(59, 130, 246, 0.2) !important;
    color: #60a5fa !important;
}
.hr-teams-module .teams-team-icon {
    background: rgba(59, 130, 246, 0.18) !important;
    color: #60a5fa !important;
}
.hr-teams-module .teams-dept-header,
.hr-teams-module .teams-team-header {
    flex-wrap: wrap;
    gap: 0.5rem;
}
/* Przyciski akcji – ten sam styl co w Role (szare) */
.hr-teams-module .teams-dept-header .btn-primary,
.hr-teams-module .teams-team-header .btn-primary,
.hr-teams-module .reports-section-box .btn-primary {
    background: #4b5563 !important;
    border-color: #4b5563 !important;
    color: #fff !important;
}
.hr-teams-module .teams-dept-header .btn-primary:hover,
.hr-teams-module .teams-team-header .btn-primary:hover,
.hr-teams-module .reports-section-box .btn-primary:hover {
    background: #6b7280 !important;
    border-color: #6b7280 !important;
    color: #fff !important;
}

/* ========== HR Dokumenty (modules/hr_employee_documents) – boxy, tabela responsywna, layout sidebar+zawartość ========== */
/* Pełna wysokość tylko gdy widoczny jest widok dokumentów (szczegóły), żeby nie było pustej ramki pod listą */
.hr-employee-documents-module:has(#employeeDocumentsDetailView:not(.d-none)) {
    height: 100%;
    min-height: 0;
}
.hr-employee-documents-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
.hr-employee-documents-module .hr-employee-documents-table {
    min-width: 0;
}
.hr-employee-documents-module .hr-employee-documents-table thead th,
.hr-employee-documents-module .hr-employee-documents-table tbody td {
    padding: 0.5rem 0.5rem;
    font-size: 0.875rem;
    vertical-align: middle;
}
@media (max-width: 767.98px) {
    .hr-employee-documents-module .hr-employee-documents-table thead th,
    .hr-employee-documents-module .hr-employee-documents-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
    .hr-employee-documents-module .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* Widok szczegółów: sidebar (drzewo) + zawartość – desktop obok, mobile stack */
.employee-documents-content {
    gap: 0;
}
@media (min-width: 992px) {
    .employee-documents-content {
        flex-direction: row;
    }
    .employee-doc-sidebar-wrap {
        flex: 0 0 30%;
        min-width: 200px;
        max-width: 420px;
    }
}
@media (max-width: 991.98px) {
    .employee-documents-content {
        flex-direction: column;
    }
    .employee-doc-sidebar-wrap {
        width: 100%;
        max-height: 280px;
    }
    .employee-doc-sidebar-scroll {
        max-height: 220px;
    }
}
.employee-doc-preview-frame-wrap {
    position: relative;
    width: 100%;
    min-height: 400px;
}
.employee-doc-preview-iframe {
    width: 100%;
    height: 600px;
    min-height: 400px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
@media (max-width: 767.98px) {
    .employee-doc-preview-iframe {
        height: 400px;
        min-height: 300px;
    }
}
.hr-employee-documents-module .dir-folder-wrapper .dir-row {
    padding: 0.25rem 0;
}
.hr-employee-documents-module .dir-folder-wrapper .title {
    color: var(--text);
}

/* ========== HR Wynagrodzenia (modules/hr_salaries) – szary box, tabela responsywna ========== */
.hr-salaries-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
}
.hr-salaries-module .hr-salaries-table {
    min-width: 0;
}
@media (max-width: 767.98px) {
    .hr-salaries-module .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ========== HR Baza kandydatów (modules/hr_candidate_database) – szare boxy, tabela, filtry ========== */
.hr-candidate-database-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
.hr-candidate-database-module .hr-candidate-database-table {
    min-width: 0;
}
.hr-candidate-database-module .hr-candidate-database-table thead th,
.hr-candidate-database-module .hr-candidate-database-table tbody td {
    padding: 0.5rem 0.5rem;
    font-size: 0.875rem;
    vertical-align: middle;
}
@media (max-width: 767.98px) {
    .hr-candidate-database-module .hr-candidate-database-table thead th,
    .hr-candidate-database-module .hr-candidate-database-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
    .hr-candidate-database-module .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* Filtr umiejętności – tag z poziomem 1–5 */
.hr-candidate-database-module .recruitment-skill-filter-tag {
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 999px;
    gap: 0.5rem;
    box-shadow: 0 1px 4px rgba(59, 130, 246, 0.12);
}
.hr-candidate-database-module .recruitment-skill-filter-dots {
    gap: 3px;
}
.hr-candidate-database-module .recruitment-skill-filter-level-btn {
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, transform 0.1s ease;
}
.hr-candidate-database-module .recruitment-skill-filter-level-btn:hover {
    background: rgba(255, 255, 255, 0.12);
    transform: scale(1.08);
}
.hr-candidate-database-module .recruitment-skill-filter-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.45);
    background: rgba(255, 255, 255, 0.15);
    transition: background 0.15s ease, border-color 0.15s ease;
}
.hr-candidate-database-module .recruitment-skill-filter-level-btn.recruitment-skill-level-filled .recruitment-skill-filter-dot {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.4);
}
.hr-candidate-database-module .recruitment-skill-filter-remove:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.15);
}
/* Szczegóły kandydata – przycisk rekrutacji (nazwa + status) */
.hr-candidate-database-module .recruitment-db-recruitment-item {
    border: 1px solid rgba(110, 168, 254, 0.35);
    background: rgba(110, 168, 254, 0.08);
    color: #b7d0ff;
    border-radius: var(--radius);
    padding: 0.5rem 0.75rem;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.hr-candidate-database-module .recruitment-db-recruitment-item:hover {
    background: rgba(110, 168, 254, 0.15);
    border-color: rgba(110, 168, 254, 0.5);
    color: #dbeafe;
}
.hr-candidate-database-module .recruitment-db-recruitment-status {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 500;
    flex-shrink: 0;
}

/* ========== HR Rekrutacja (modules/hr_recruitment) – szare boxy, tabela responsywna, CV/feedback ========== */
.hr-recruitment-module .reports-section-box.card-surface {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: none;
}
.hr-recruitment-module .hr-recruitment-table {
    min-width: 0;
}
.hr-recruitment-module .hr-recruitment-table thead th,
.hr-recruitment-module .hr-recruitment-table tbody td {
    padding: 0.5rem 0.5rem;
    font-size: 0.875rem;
    vertical-align: middle;
}
@media (max-width: 767.98px) {
    .hr-recruitment-module .hr-recruitment-table thead th,
    .hr-recruitment-module .hr-recruitment-table tbody td {
        padding: 0.4rem 0.35rem;
        font-size: 0.8rem;
    }
    .hr-recruitment-module .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* Rekrutacja: zakładka Feedback – bez rozciągania */
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabFeedback.active),
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabDecision.active),
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabSkills.active) {
    min-height: 0;
    height: auto;
    align-self: flex-start;
}
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabFeedback.active) #recruitmentTabCv,
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabDecision.active) #recruitmentTabCv,
.hr-recruitment-module #recruitmentCandidateTabContent:has(#recruitmentTabSkills.active) #recruitmentTabCv {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}
.hr-recruitment-module .recruitment-tab-feedback {
    min-height: 0;
    height: auto !important;
    align-self: flex-start;
}
/* Rekrutacja: lista plików CV */
.hr-recruitment-module #recruitmentCvList {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.4rem 0.75rem;
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item {
    padding: 0.4rem 0.5rem;
    margin: 0;
    gap: 0.5rem;
    font-size: 0.875rem;
    min-width: 0;
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item .bi-file-earmark-pdf {
    font-size: 1rem;
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item .btn {
    padding: 0.2rem 0.4rem;
    font-size: 0.75rem;
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item .flex-grow-1 {
    overflow: hidden;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    color: var(--text);
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item .flex-grow-1 .text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block !important;
    max-width: 100%;
    color: var(--text);
}
.hr-recruitment-module #recruitmentCvList .recruitment-cv-item .flex-grow-1 .text-muted.small {
    color: rgba(229, 231, 235, 0.85);
    font-size: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.hr-teams-module .teams-member-item {
    background: var(--panel-2) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.hr-teams-module .teams-member-item:hover {
    background: var(--panel-2) !important;
    border-color: var(--border);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}
/* Imię i nazwisko członka – wyraźny kolor tekstu */
.hr-teams-module .teams-member-item .fw-medium {
    color: var(--text) !important;
    font-weight: 600;
}
/* Etykiety ról (badge) – ten sam odcień co karty w Role */
.hr-teams-module .teams-member-item .badge-soft {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
.hr-teams-module .teams-member-avatar {
    color: var(--muted) !important;
}
.hr-teams-module .teams-empty-state {
    border-radius: var(--radius);
}
@media (max-width: 767.98px) {
    .hr-teams-module .teams-dept-header,
    .hr-teams-module .teams-team-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .hr-teams-module .teams-teams-list {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
    .hr-teams-module .teams-member-item {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
}

/* Moduł Czas pracy (Rozliczenia) – sekcje w boxach, tabele responsywne */
.settlements-work-time-module .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.settlements-work-time-module .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 991.98px) {
    .settlements-work-time-module .table-responsive {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
    }
    .settlements-work-time-module .table-responsive table {
        min-width: 640px;
    }
}
/* Tekst „Brak danych” / „Ładowanie…” w tabeli – biały (jak reszta treści) */
.settlements-work-time-module .table-darkish tbody td.settlements-work-time-empty-cell {
    color: #fff !important;
}
.settlements-work-time-module .table-darkish tbody td.text-muted {
    color: var(--text) !important;
}
/* Panel pracownika – tytuł tabeli „Godziny i rozliczenie per pracownik” na biało */
.employee-panel-settlement-table-header h5 {
    color: #fff !important;
}

/* Moduł Premie (Rozliczenia) – sekcje w boxach, tabele responsywne, przyciski ikonki */
.settlements-bonuses-module .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.settlements-bonuses-module .settlements-bonuses-title,
.settlements-bonuses-module .settlements-bonuses-table-title {
    color: var(--text);
}
.settlements-bonuses-module .table-responsive.settlements-bonuses-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.settlements-bonuses-module .settlements-bonuses-period-input {
    max-width: 180px;
}
.settlements-bonuses-module .btn-icon-only {
    padding: 0.375rem 0.5rem;
}
.settlements-bonuses-module .btn-icon-only i {
    margin: 0;
}
/* Przyciski tylko-ikonka (używane m.in. w modalu Premie, modal w body) */
.btn-icon-only {
    padding: 0.375rem 0.5rem;
}
.btn-icon-only i {
    margin: 0;
}
@media (max-width: 991.98px) {
    .settlements-bonuses-module .table-responsive.settlements-bonuses-table-wrap {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
    }
    .settlements-bonuses-module .table-responsive.settlements-bonuses-table-wrap table {
        min-width: 520px;
    }
}

/* Moduł Przychody – taby (ikonki + etykieta z animacją), tabele responsywne */ taby (ikonki + etykieta z animacją), tabele responsywne */
.invoice-income-module .reports-section-box .card-body,
.invoice-income-module .reports-section-box .card-body h2,
.invoice-income-module .reports-section-box .card-body h4,
.invoice-income-module .reports-section-box .card-body h5,
.invoice-income-module .reports-section-box .card-body h6 {
    color: var(--text) !important;
}
.invoice-income-module .invoice-income-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.invoice-income-module .invoice-income-tabs .tab-label {
    white-space: nowrap;
    transition: max-width 0.2s ease, opacity 0.2s ease;
}
@media (max-width: 767.98px) {
    .invoice-income-module .invoice-income-tabs .tab-label {
        max-width: 0;
        overflow: hidden;
        opacity: 0;
    }
    .invoice-income-module .invoice-income-tabs .nav-link.active .tab-label,
    .invoice-income-module .invoice-income-tabs .nav-link:hover .tab-label {
        max-width: 8em;
        opacity: 1;
    }
}
.invoice-income-module .invoices-list table {
    font-size: 0.875rem;
}
/* Lista bez bocznych paddingów – ramki miesięcy w tej samej szerokości co box z filtrami */
.invoice-income-module .invoices-list.invoices-list-full-width {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}
.invoice-income-module .invoices-list.invoices-list-full-width .invoice-income-month-frame {
    width: 100%;
    max-width: 100%;
}
/* Nagłówki ramek miesięcy – styl jak w raportach (biały tekst, wyraźny nagłówek, badge) */
.invoice-income-module .invoice-income-month-frame {
    background: var(--card);
    border: 1px solid var(--border);
}
.invoice-income-module .invoice-income-month-frame-header {
    background: rgba(255, 255, 255, 0.06);
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--border);
}
.invoice-income-module .invoice-income-month-frame-title {
    color: var(--text);
    font-weight: 700;
    font-size: 0.9375rem;
    display: inline-flex;
    align-items: center;
}
.invoice-income-module .invoice-income-month-frame-title .bi-calendar3 {
    color: var(--text);
    opacity: 0.9;
}
.invoice-income-module .invoice-income-month-frame-count {
    background: rgba(255, 255, 255, 0.12);
    color: var(--text);
    border: none;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius, 0.375rem);
}
@media (max-width: 991.98px) {
    .invoice-income-module .invoices-list .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .invoice-income-module .invoices-list table {
        font-size: 0.8125rem;
    }
}

/* Moduł Koszty (Faktury kosztowe) – kolory i zakładki */
.invoice-cost-module .reports-section-box .card-body,
.invoice-cost-module .reports-section-box .card-body h2,
.invoice-cost-module .reports-section-box .card-body h4,
.invoice-cost-module .reports-section-box .card-body h5,
.invoice-cost-module .reports-section-box .card-body h6 {
    color: var(--text) !important;
}
.invoice-cost-module .invoice-cost-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.invoice-cost-module .invoice-cost-tabs .tab-label {
    white-space: nowrap;
    transition: max-width 0.2s ease, opacity 0.2s ease;
}
@media (max-width: 767.98px) {
    .invoice-cost-module .invoice-cost-tabs .tab-label {
        max-width: 0;
        overflow: hidden;
        opacity: 0;
    }
    .invoice-cost-module .invoice-cost-tabs .nav-link.active .tab-label,
    .invoice-cost-module .invoice-cost-tabs .nav-link:hover .tab-label {
        max-width: 8em;
        opacity: 1;
    }
}
@media (max-width: 991.98px) {
    .invoice-cost-module .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .invoice-cost-module .invoice-cost-list table {
        font-size: 0.8125rem;
    }
}

/* Lista bez bocznych paddingów – ramki miesięcy w tej samej szerokości co box z filtrami */
.invoice-cost-module .invoice-cost-list.invoice-cost-list-full-width {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}
.invoice-cost-module .invoice-cost-list.invoice-cost-list-full-width .invoice-cost-month-frame {
    width: 100%;
    max-width: 100%;
}
/* Nagłówki ramek miesięcy i thead tabeli – jak w module Przychody */
.invoice-cost-module .invoice-cost-month-frame {
    background: var(--card);
    border: 1px solid var(--border);
}
.invoice-cost-module .invoice-cost-month-frame-header {
    background: rgba(255, 255, 255, 0.06);
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--border);
}
.invoice-cost-module .invoice-cost-month-frame-title {
    color: var(--text);
    font-weight: 700;
    font-size: 0.9375rem;
    display: inline-flex;
    align-items: center;
}
.invoice-cost-module .invoice-cost-month-frame-title .bi-calendar3 {
    color: var(--text);
    opacity: 0.9;
}
.invoice-cost-module .invoice-cost-month-frame-count {
    background: rgba(255, 255, 255, 0.12);
    color: var(--text);
    border: none;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius, 0.375rem);
}
.invoice-cost-module .table-darkish thead th {
    background: var(--panel) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    font-weight: 600;
}

.reports-view {
    min-height: 0;
    width: 100%;
    overflow-x: hidden;
    padding-bottom: 2rem;
}
.reports-list-view {
    min-height: 0;
}
/* Konta raportowe – dodatkowy padding na dole listy, żeby ostatnie konto nie było ucięte */
#reportsClientReportsView #reportsTableContainer {
    padding-bottom: 2rem;
}

/* Przyciski tylko z ikonką (Raporty, inne moduły) */
.btn-icon-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    min-width: 2.25rem;
}
.btn-icon-only .bi {
    font-size: 1.1rem;
}

/* Action button – square, fixed size, primary/secondary/danger (assets/components/action-button.js) */
.action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0;
    border: none;
    border-radius: var(--radius, 10px);
    cursor: pointer;
    position: relative;
    transition: filter 0.15s ease;
}
.action-btn:focus {
    outline: none;
}
.action-btn:hover:not(:disabled) {
    filter: brightness(1.1);
}
.action-btn:active:not(:disabled) {
    filter: brightness(0.95);
}
.action-btn:disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

.action-btn__content {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.1rem;
}
.action-btn__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.action-btn__icon .bi {
    font-size: 1rem;
    color: #fff;
}
.action-btn__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.action-btn__arrow .bi {
    font-size: 0.55rem;
    color: rgba(255, 255, 255, 0.9);
}

.action-btn__count {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 4px;
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1.1rem;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 10px;
}

.action-btn__spinner {
    display: none;
    position: absolute;
    inset: 0;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.action-btn--loading .action-btn__content,
.action-btn--loading .action-btn__count {
    visibility: hidden;
    pointer-events: none;
}
.action-btn--loading .action-btn__spinner {
    display: flex;
}

.action-btn--primary {
    background: var(--brand);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.action-btn--secondary {
    background: var(--panel-2);
    color: var(--text);
    box-shadow: 0 0 0 1px var(--border);
}
.action-btn--secondary .action-btn__icon .bi,
.action-btn--secondary .action-btn__arrow .bi {
    color: var(--text);
}
.action-btn--secondary .action-btn__count {
    background: rgba(0, 0, 0, 0.35);
    color: var(--text);
}
.action-btn--danger {
    background: var(--danger);
}
.action-btn--danger .action-btn__icon .bi,
.action-btn--danger .action-btn__arrow .bi {
    color: #fff;
}
.action-btn .action-btn__label {
    margin-left: 0.25rem;
    font-size: 0.875rem;
    white-space: nowrap;
}
.action-btn:has(.action-btn__label) {
    width: auto;
    min-width: 2rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.action-btn--secondary .action-btn__spinner {
    color: var(--text);
}

/* Katalog licencji – sekcje w szarych boxach */
.licenses-catalog-module .reports-section-box {
    background: var(--panel-2);
    color: var(--text);
}

/* Przychody vs Koszty – jak w Raporcie z Kosztów: tylko karty w szarym boxie, kontener bez tła (przerwy = tło strony) */
.reports-costs-vs-profits.accounting-report-container {
    margin-bottom: 0;
    padding-bottom: 0;
    background: transparent;
    color: var(--text);
}
.reports-costs-vs-profits .card.card-surface {
    background: var(--panel-2);
    color: var(--text);
}
/* Usuń linię (górną ramkę) między kartami podsumowania a wykresem */
.reports-costs-vs-profits .row.mb-3 + .card.card-surface {
    border-top: none;
}
.reports-costs-vs-profits .text-body {
    color: var(--text) !important;
}
.reports-costs-vs-profits .reports-cvp-card .card-body {
    padding: 0.75rem 1rem;
}
.reports-costs-vs-profits .reports-cvp-margin-value {
    color: var(--nav-accent);
}
.reports-costs-vs-profits .reports-cvp-chart {
    position: relative;
    width: 100%;
    min-height: 200px;
}
.reports-costs-vs-profits .reports-cvp-table-footer {
    background: rgba(122, 162, 255, 0.1);
    font-weight: 600;
    color: var(--text);
}
@media (max-width: 767.98px) {
    .reports-costs-vs-profits .reports-cvp-chart {
        height: 260px !important;
    }
    .reports-costs-vs-profits .table-responsive {
        font-size: 0.875rem;
    }
}
.reports-income-invoices .reports-section-box .card-body,
.reports-income-invoices .reports-section-box .card-header {
    color: var(--text);
}
.reports-income-invoices .reports-section-box h4,
.reports-income-invoices .reports-section-box h5,
.reports-income-invoices .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-income-invoices-table-foot {
    background: rgba(255, 255, 255, 0.06);
    font-weight: 600;
}
/* Kontenery wykresów – ograniczenie szerokości na mobile, żeby nie uciekały poza ekran */
.reports-income-invoices .chart-container,
.reports-income-invoices .chart-container-mobile {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-height: 200px;
    overflow: hidden;
}
.reports-income-invoices .reports-section-box .card-body .chart-container {
    max-width: 100%;
}
.reports-income-invoices .row .col-12 .reports-section-box {
    min-width: 0;
}
.reports-income-invoices .reports-section-box .card-body {
    min-width: 0;
}
/* Tabela – przewijanie poziome na mobile bez ucinania */
.reports-income-invoices .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}
.reports-income-invoices .table-responsive table {
    min-width: 720px;
}
@media (max-width: 767.98px) {
    .reports-income-invoices .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

/* Raport z Kosztów – spójność z innymi modułami raportów */
.reports-cost-invoices .reports-section-box .card-body,
.reports-cost-invoices .reports-section-box .card-header {
    color: var(--text);
}
.reports-cost-invoices .reports-section-box h4,
.reports-cost-invoices .reports-section-box h5,
.reports-cost-invoices .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-cost-invoices-table-foot {
    background: rgba(255, 255, 255, 0.06);
    font-weight: 600;
}
.reports-cost-invoices .reports-section-box .card-body .chart-container,
.reports-cost-invoices .chart-container-mobile {
    max-width: 100%;
}
.reports-cost-invoices .row .col-12 .reports-section-box {
    min-width: 0;
}
.reports-cost-invoices .reports-section-box .card-body {
    min-width: 0;
}
.reports-cost-invoices .reports-section-box .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}
.reports-cost-invoices .table-responsive table {
    min-width: 720px;
}
@media (max-width: 767.98px) {
    .reports-cost-invoices .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

/* Konta raportowe – szare boxy sekcji, tabele responsywne, zakładki pretty-tabs */
.reports-section-box {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
/* Nagłówki i etykiety w sekcjach Kont raportowych – wyraźnie widoczne */
.reports-section-box .card-header {
    background: rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid var(--border);
    color: var(--text);
}
.reports-section-box .card-header .h5,
.reports-section-box .card-header h5,
.reports-section-box .card-header h6 {
    color: var(--text) !important;
    font-weight: 600;
}
/* Konta raportowe – nagłówek i treść w boxie z czytelną czcionką */
.reports-list-view .reports-section-box .card-body,
.reports-list-view .reports-section-box .card-header {
    color: var(--text);
}
.reports-list-view .reports-section-box .card-body h4,
.reports-list-view .reports-section-box .card-body h5,
.reports-list-view .reports-section-box .card-body h6 {
    color: var(--text) !important;
    font-weight: 600;
}
.reports-section-box .form-label {
    color: var(--text) !important;
    font-weight: 500;
}
.reports-section-box .form-check-label {
    color: var(--text) !important;
}
/* Przełącznik w modalu „Edytuj lokalizację” – jeden spójny wygląd (bez podwójnych kół) */
#modalLocation .form-check.form-switch .form-check-input {
    width: 2.75rem;
    height: 1.5rem;
    margin-top: 0;
    margin-left: 0;
    cursor: pointer;
    border: 2px solid rgba(255, 255, 255, 0.25);
    background-color: rgba(255, 255, 255, 0.12);
    transition: all 0.25s ease;
    -webkit-appearance: none;
    appearance: none;
    background-image: none;
    position: relative;
}
#modalLocation .form-check.form-switch .form-check-input::before {
    content: '';
    position: absolute;
    left: 2px;
    top: 50%;
    transform: translateY(-50%);
    width: 1.1rem;
    height: 1.1rem;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.25s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
#modalLocation .form-check.form-switch .form-check-input:checked {
    background-color: var(--brand);
    border-color: var(--brand);
}
#modalLocation .form-check.form-switch .form-check-input:checked::before {
    transform: translate(1.25rem, -50%);
}
#modalLocation .form-check.form-switch .form-check-input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.35);
}
.reports-section-box strong {
    color: var(--text) !important;
}
.reports-section-box .text-muted {
    color: var(--muted) !important;
}
/* Nagłówek grupy klienta (lista raportów) – odcienie szarości zamiast niebieskiego */
.reports-client-group-card {
    background: var(--panel-2);
}
.reports-client-group-header {
    background: var(--sidebar-item-bg);
    padding: 1rem 1.25rem;
    position: relative;
    border-bottom: none;
}
/* Delikatny szary pasek pod nagłówkiem – na pełną szerokość (do końca) */
.reports-client-group-header::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 1px;
    background: var(--border);
    box-sizing: content-box;
    pointer-events: none;
}
.reports-client-group-header .mb-0 {
    color: var(--sidebar-item-text);
    font-weight: 600;
}
.reports-client-group-header .bi-person {
    color: var(--muted);
}
.reports-client-group-header .badge {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text);
    border: 1px solid var(--border);
}

/* ========== Panel z tytułem (reużywalny) – jak w Liście projektów, z mniejszym tytułem ========== */
.app-panel {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.app-panel-header {
    background: rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid var(--border);
    padding: 0.875rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.app-panel-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.app-panel-title .bi {
    color: var(--muted);
    flex-shrink: 0;
}
.app-panel-body {
    padding: 1rem 1.25rem;
}
.app-panel.app-panel-no-body .app-panel-header {
    border-bottom: none;
}

/* ========== Box z tytułem u góry i treścią wypełniającą 100% boxa (np. lista po kliencie) ========== */
.app-box {
    display: flex;
    flex-direction: column;
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.app-box-header {
    flex-shrink: 0;
    background: var(--sidebar-item-bg);
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.app-box-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sidebar-item-text);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.app-box-title .bi {
    color: var(--muted);
    flex-shrink: 0;
}
.app-box-title .badge {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text);
    border: 1px solid var(--border);
}
.app-box-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    display: block;
}
.app-box-body .table-responsive,
.app-box-body .table {
    margin-bottom: 0;
}
.app-box-body > .table-responsive {
    min-height: 0;
}

/* Pasek oddzielający wiersze raportów – na pełną szerokość (tylko w tabeli listy raportów, nie w timesheet) */
.reports-client-group-card .reports-public-table.table-darkish tbody tr td {
    border-top: 1px solid var(--border);
    border-bottom: none;
}
.reports-client-group-card .reports-public-table.table-darkish tbody tr:first-child td {
    border-top: none;
}
/* Tabela timesheet – bez table-layout: fixed, żeby kolumny (dni) i pierwsza kolumna (Stawka/Użytkownik) nie rozjeżdżały się */
.timesheet-calendar-table {
    width: 100%;
    table-layout: auto;
    min-width: max-content;
}
.timesheet-calendar-table th:first-child,
.timesheet-calendar-table td:first-child {
    min-width: 220px;
    max-width: 280px;
    white-space: normal;
    word-break: break-word;
}
.timesheet-calendar-table thead th {
    vertical-align: middle;
}
.reports-section-inner {
    border-color: var(--border);
}
.timesheet-table-wrapper {
    overflow-x: scroll;
}
.timesheet-table-wrapper.hide-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.timesheet-table-wrapper.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.reports-timesheet-hscroll {
    display: block;
    width: 100%;
    height: 20px;
    min-height: 20px;
    flex-shrink: 0;
    overflow-x: scroll;
    overflow-y: hidden;
    margin-top: 4px;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.06);
    scrollbar-color: rgba(122, 162, 255, 0.5) rgba(255, 255, 255, 0.08);
}
.reports-timesheet-hscroll::-webkit-scrollbar {
    height: 12px;
}
.reports-timesheet-hscroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.08);
    border-radius: 4px;
}
.reports-timesheet-hscroll::-webkit-scrollbar-thumb {
    background: rgba(122, 162, 255, 0.5);
    border-radius: 4px;
}
.reports-timesheet-hscroll::-webkit-scrollbar-thumb:hover {
    background: rgba(122, 162, 255, 0.7);
}

/* Panel pracownika – nieobecności: kontener tabeli musi mieć min-width: 0, żeby przewijanie poziome działało */
.employee-panel-calendar-wrap.absence-team-calendar .absence-team-calendar-inner {
    min-width: 0;
}
.employee-panel-calendar-wrap.absence-team-calendar .absence-team-calendar-inner .position-relative {
    min-width: 0;
}
.employee-panel-calendar-wrap.absence-team-calendar .timesheet-table-wrapper {
    min-width: 0;
}

.report-detail-header .card-body {
    min-height: 2.5rem;
}
.report-detail-header #reportDetailTitle,
.report-detail-header .report-detail-title-text {
    color: var(--text);
    font-weight: 600;
    font-size: 1.15rem;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

.reports-detail-tabs.pretty-tabs .nav-link .tab-label,
.reports-settings-subtabs.pretty-tabs .nav-link .tab-label {
    display: inline-block;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
}
.reports-detail-tabs.pretty-tabs .nav-link:hover .tab-label,
.reports-detail-tabs.pretty-tabs .nav-link.active .tab-label,
.reports-detail-tabs.pretty-tabs .nav-link:focus-visible .tab-label,
.reports-settings-subtabs.pretty-tabs .nav-link:hover .tab-label,
.reports-settings-subtabs.pretty-tabs .nav-link.active .tab-label,
.reports-settings-subtabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 160px;
    opacity: 1;
    margin-left: 0.25rem;
}
@media (max-width: 767.98px) {
    .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ========== Rozliczenie pracowników (Raporty) – sekcje, wartości, tabele responsywne ========== */
.reports-employee-settlement .reports-section-box .card-body,
.reports-employee-settlement .reports-section-box .card-header {
    color: var(--text);
}
.reports-employee-settlement .reports-section-box h4,
.reports-employee-settlement .reports-section-box h5,
.reports-employee-settlement .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-employee-settlement-value {
    color: var(--brand);
}
.reports-employee-settlement .table-responsive.reports-employee-settlement-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 767.98px) {
    .reports-employee-settlement .reports-section-box .table-responsive.reports-employee-settlement-table-wrap {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    .reports-employee-settlement .reports-employee-settlement-table-wrap table {
        min-width: 600px;
    }
}
/* Szczegóły pracownika – tabele w app-box na pełną szerokość (jak w głównej liście) */
.reports-employee-settlement-details .app-box .app-box-body > .table-responsive {
    width: 100%;
}
.reports-employee-settlement-details .app-box .app-box-body .table-responsive table {
    width: 100%;
    table-layout: fixed;
}
/* Godziny i kwota w nagłówku raportu przyklejone do prawej krawędzi boxa */
.reports-employee-settlement-details .app-box .app-box-header {
    padding-right: 0;
}
.reports-employee-settlement-details .app-box .app-box-header > .d-flex {
    width: 100%;
}
.reports-employee-settlement-details .app-box .app-box-header .d-flex > .text-end:last-child {
    margin-left: auto;
    padding-right: 0.5rem;
}

/* ========== Raporty finansowe (Raporty) – sekcje, wartości, tabele responsywne ========== */
.reports-financial .financial-report-row {
    cursor: pointer;
}
.reports-financial .reports-section-box .card-body,
.reports-financial .reports-section-box .card-header {
    color: var(--text);
}
.reports-financial .chart-container {
    min-height: 220px;
    position: relative;
}
.reports-financial .reports-section-box h4,
.reports-financial .reports-section-box h5,
.reports-financial .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-financial-value {
    color: var(--brand);
}
.reports-financial-table-tfoot {
    background: rgba(122, 162, 255, 0.1);
    font-weight: 600;
}
.reports-financial .table-responsive.reports-financial-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 767.98px) {
    .reports-financial .reports-section-box .table-responsive.reports-financial-table-wrap {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    .reports-financial .reports-financial-table-wrap table {
        min-width: 500px;
    }
}

/* ========== Oferty / Projekty (Raporty) – responsywne tabele i karty ========== */
.reports-offers-projects .reports-section-box .card-body,
.reports-offers-projects .reports-section-box .card-header,
.reports-offers-projects .reports-client-group-header {
    color: var(--text);
}
.reports-offers-projects .reports-section-box h4,
.reports-offers-projects .reports-section-box h5,
.reports-offers-projects .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-offers-projects .fin-card {
    background: rgba(255, 255, 255, 0.04);
    border-radius: var(--radius);
    padding: 0.75rem;
}
.reports-offers-projects .fin-label {
    font-size: 0.8rem;
    color: var(--muted);
}
.reports-offers-projects .fin-value {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text);
}
.reports-offers-projects .finance-report-row {
    cursor: pointer;
}
.reports-offers-projects .reports-offers-projects-tabs.pretty-tabs .nav-link .tab-label {
    display: inline-block;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin-left 0.2s ease;
}
.reports-offers-projects .reports-offers-projects-tabs.pretty-tabs .nav-link:hover .tab-label,
.reports-offers-projects .reports-offers-projects-tabs.pretty-tabs .nav-link.active .tab-label,
.reports-offers-projects .reports-offers-projects-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 160px;
    opacity: 1;
    margin-left: 0.25rem;
}
@media (max-width: 767.98px) {
    .reports-offers-projects .reports-section-box .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .reports-offers-projects .reports-client-group-card .table-responsive table {
        min-width: 640px;
    }
    .reports-offers-projects .reports-offers-projects-tabs .nav-link {
        padding: 0.5rem 0.4rem;
        font-size: 0.9rem;
    }
}

/* Ruch na stronie (Raporty) – szare boxy, wykresy, tabele responsywne */
.reports-page-traffic .reports-section-box .card-body,
.reports-page-traffic .reports-section-box .card-header {
    color: var(--text);
}
.reports-page-traffic .reports-section-box h4,
.reports-page-traffic .reports-section-box h5,
.reports-page-traffic .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-page-traffic .chart-container.page-traffic-chart {
    height: 280px;
}
@media (min-width: 992px) {
    .reports-page-traffic .chart-container.page-traffic-chart {
        height: 300px;
    }
}
.reports-page-traffic .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.reports-page-traffic .page-traffic-scripts-table tbody tr[data-traffic-script-id] {
    cursor: pointer;
}
@media (max-width: 767.98px) {
    .reports-page-traffic .reports-section-box .table-responsive {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .reports-page-traffic .table-responsive table {
        min-width: 720px;
    }
}

/* Raport newsletter – szare boxy, responsywność */
.reports-newsletter-report .reports-section-box .card-body,
.reports-newsletter-report .reports-section-box .card-header {
    color: var(--text);
}
.reports-newsletter-report .reports-section-box h4,
.reports-newsletter-report .reports-section-box h5,
.reports-newsletter-report .reports-section-box h6 {
    color: var(--text) !important;
}
.reports-newsletter-report .newsletter-report-kpi-campaigns {
    color: var(--nav-accent);
}
.reports-newsletter-report .newsletter-report-kpi-conversion {
    color: var(--success);
}
.reports-newsletter-report .chart-container.newsletter-report-chart {
    height: 280px;
    position: relative;
    width: 100%;
}
@media (min-width: 992px) {
    .reports-newsletter-report .chart-container.newsletter-report-chart {
        height: 320px;
    }
}
.reports-newsletter-report .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 767.98px) {
    .reports-newsletter-report .reports-section-box .table-responsive {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .reports-newsletter-report .table-responsive table {
        min-width: 560px;
    }
}

/* Raport Ankiety Jakości – czytelne liczby i etykiety w podsumowaniu */
.reports-quality-survey .reports-section-box .card-body,
.reports-quality-survey .reports-section-box .card-header {
    color: var(--text);
}
.reports-quality-survey .reports-section-box h4,
.reports-quality-survey .reports-section-box h5,
.reports-quality-survey .reports-section-box h6 {
    color: var(--text) !important;
    font-weight: 600;
}
.reports-quality-survey .reports-section-box .card-body .small {
    color: var(--text);
    opacity: 0.9;
}
.reports-quality-survey #qualitySurveyAverageRating,
.reports-quality-survey #qualitySurveyTotalResponses,
.reports-quality-survey #qualitySurveyTotalSurveys {
    color: var(--text) !important;
    font-weight: 600;
}
.reports-quality-survey .rating-low { color: var(--danger, #ef4444) !important; }
.reports-quality-survey .rating-mid { color: var(--warning, #eab308) !important; }
.reports-quality-survey .rating-high { color: var(--success, #22c55e) !important; }
.reports-quality-survey .quality-survey-detail-row td { background: var(--panel-2); padding-left: 2rem; }
.reports-quality-survey .quality-survey-detail-row .detail-inner { font-size: 0.9rem; }

.crm-container,
.crm-nav-container {
    width: 100%;
    overflow-x: hidden;
}
.crm-nav-row {
    gap: 0;
    min-height: calc(100vh - 64px);
    min-width: 0;
}
.crm-nav-sidebar {
    width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.crm-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
}
.crm-nav-inner {
    padding: 0.5rem;
}
.crm-nav-inner .list-group {
    margin: 0;
}
.crm-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
.crm-nav-footer-link {
    opacity: 0.7;
}
.crm-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    overflow-x: hidden;
    transition: margin-left 0.2s ease, width 0.2s ease;
}

/* Stan zwinięty sidebara CRM – tylko na mobile */
@media (max-width: 991.98px) {
    .crm-nav-container.crm-sidebar-collapsed .crm-nav-sidebar {
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border-right-width: 0;
        transition: width 0.2s ease, min-width 0.2s ease;
    }
    .crm-nav-container.crm-sidebar-collapsed .crm-content-area {
        margin-left: 0;
        width: 100%;
    }
}

/* Backdrop dla sidebara CRM (mobile) */
.crm-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
.crm-nav-item {
    color: var(--sidebar-item-text);
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}
.crm-nav-item:hover {
    color: var(--sidebar-item-text);
    text-decoration: none;
}
.crm-nav-item.active {
    background: var(--sidebar-item-active-bg) !important;
    border-color: var(--sidebar-item-active-border) !important;
    box-shadow: none;
}
.crm-nav-item.active i {
    color: var(--sidebar-item-text);
}
.crm-nav-item i {
    color: rgba(255, 255, 255, 0.85);
}
.crm-nav-item .crm-nav-label {
    display: inline-block;
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}
.crm-nav-item.active .crm-nav-label {
    width: auto;
    opacity: 1;
}

@media (max-width: 991.98px) {
    .crm-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
    }
    .crm-nav-container:not(.crm-sidebar-collapsed) .crm-nav-sidebar {
        transform: translateX(0);
    }
    .crm-nav-container:not(.crm-sidebar-collapsed) .crm-nav-backdrop {
        display: block;
    }
    .crm-nav-row {
        flex-wrap: nowrap;
    }
    .crm-content-area {
        margin-left: 0;
        width: 100%;
        min-width: 0;
    }
}

.crm-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}
#crmContactMessagesView.crm-view {
    min-height: 0;
}

/* ========== Moduł Firma – nawigacja boczna (jak CRM) ========== */
.company-container,
.company-nav-container {
    width: 100%;
    overflow-x: hidden;
}
.company-nav-row {
    gap: 0;
    min-height: calc(100vh - 64px);
    min-width: 0;
}
.company-nav-sidebar {
    width: 250px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    transition: width 0.2s ease, transform 0.25s ease;
}
.company-nav-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
}
.company-nav-inner {
    padding: 0.5rem;
}
.company-nav-inner .list-group {
    margin: 0;
}
.company-nav-footer {
    flex-shrink: 0;
    border-color: var(--border);
}
.company-nav-footer-link {
    opacity: 0.7;
}
.company-content-area {
    margin-left: 250px;
    width: calc(100% - 250px);
    min-width: 0;
    overflow-x: hidden;
    padding: 0.75rem;
    transition: margin-left 0.2s ease, width 0.2s ease;
}
@media (max-width: 991.98px) {
    .company-nav-container.company-sidebar-collapsed .company-nav-sidebar {
        width: 0;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        border-right-width: 0;
    }
    .company-nav-container.company-sidebar-collapsed .company-content-area {
        margin-left: 0;
        width: 100%;
    }
}
.company-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
.company-nav-item .company-nav-label {
    display: inline-block;
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}
@media (max-width: 991.98px) {
    .company-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
    }
    .company-nav-container:not(.company-sidebar-collapsed) .company-nav-sidebar {
        transform: translateX(0);
    }
    .company-nav-container:not(.company-sidebar-collapsed) .company-nav-backdrop {
        display: block;
    }
    .company-nav-row {
        flex-wrap: nowrap;
    }
    .company-content-area {
        margin-left: 0;
        width: 100%;
        min-width: 0;
        padding: 0.75rem;
    }
}
.company-nav-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}

/* Zakładki Dane firmy – pretty-tabs (ikonki, tekst przy hover/active) */
.company-data-tabs.pretty-tabs .nav-link .tab-label {
    white-space: nowrap;
    transition: width 0.3s ease, opacity 0.3s ease;
    overflow: hidden;
}
.company-data-tabs.pretty-tabs .nav-link:not(.active) .tab-label {
    width: 0;
    opacity: 0;
    margin: 0;
    padding: 0;
}
.company-data-tabs.pretty-tabs .nav-link:hover .tab-label,
.company-data-tabs.pretty-tabs .nav-link.active .tab-label,
.company-data-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    width: auto;
    opacity: 1;
    margin-left: 0.25rem;
}

/* Konta bankowe – nazwa konta czytelna na ciemnym tle */
.bank-accounts-list .card-surface h6 {
    color: var(--text) !important;
    font-weight: 600;
}

/* Lokalizacje firmowe – nazwa lokalizacji czytelna na ciemnym tle */
.locations-list .card-surface h6.location-title {
    color: var(--text) !important;
    font-weight: 600;
}


/* CRM Wiadomości kontaktowe – layout, sekcje, sidebar wątków, czat, responsywność */
body:has(#crmContactMessagesView:not(.d-none)) {
    overflow: hidden !important;
    height: 100vh !important;
}
html:has(#crmContactMessagesView:not(.d-none)) {
    overflow: hidden !important;
    height: 100vh !important;
}
/* Obszar treści CRM przy wiadomościach – stała wysokość + odstęp od dołu */
#crmContentArea:has(#crmContactMessagesView:not(.d-none)) {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px);
    padding-bottom: 2rem;
    box-sizing: border-box;
}
#crmContactMessagesView {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px - 2rem);
    max-height: calc(100vh - 64px - 2rem);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    flex-shrink: 0;
}
#crmWrapper:has(#crmContactMessagesView:not(.d-none)),
.crm-container:has(#crmContactMessagesView:not(.d-none)) {
    overflow: hidden !important;
    max-height: calc(100vh - 96px) !important;
    max-width: 100% !important;
}
@media (max-width: 767.98px) {
    body:has(#crmContactMessagesView:not(.d-none)),
    html:has(#crmContactMessagesView:not(.d-none)) {
        overflow: auto !important;
        height: auto !important;
    }
    #crmContactMessagesView {
        height: auto;
        min-height: 60vh;
        max-height: none;
        overflow: visible;
    }
    #crmContentArea:has(#crmContactMessagesView:not(.d-none)) {
        height: auto;
        padding-bottom: 0;
    }
    #crmWrapper:has(#crmContactMessagesView:not(.d-none)),
    .crm-container:has(#crmContactMessagesView:not(.d-none)) {
        overflow: visible !important;
        max-height: none !important;
    }
    .crm-contact-messages {
        overflow: visible;
    }
    .crm-contact-messages .row.g-2 {
        overflow: visible;
        flex-direction: column;
    }
    .crm-contact-messages .row.g-2 > .col-12 {
        min-height: 280px;
        max-height: 45vh;
    }
    .crm-contact-messages .row.g-2 > .col {
        min-height: 300px;
    }
}
.crm-contact-messages .crm-contact-messages-section.card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius, 0.375rem);
}
.crm-contact-messages {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.crm-contact-messages .row.g-2 {
    min-width: 0;
}
.crm-contact-messages .row.g-2 > [class*="col"] {
    min-width: 0;
}
.crm-contact-messages .crm-threads-sidebar {
    background: var(--panel-2);
    border-color: var(--border);
}
.crm-contact-messages .crm-threads-sidebar,
.crm-contact-messages .crm-threads-sidebar small {
    color: var(--muted);
}
.crm-contact-messages .crm-threads-sidebar .contact-thread-group-header {
    color: var(--sidebar-item-text, inherit);
}
.crm-contact-messages .crm-threads-sidebar #contactThreadsList {
    background: var(--panel-2);
}
.crm-contact-messages .crm-threads-sidebar .contact-thread-item {
    transition: background 0.15s ease;
    border-color: var(--border);
}
.crm-contact-messages .crm-threads-sidebar .contact-thread-item:hover {
    background: var(--sidebar-item-active-bg, rgba(255,255,255,0.08));
}
.crm-contact-messages .crm-threads-sidebar .contact-thread-item.contact-thread-item-active {
    background: var(--sidebar-item-active-bg, rgba(255,255,255,0.12));
}
.crm-contact-messages .crm-threads-sidebar .contact-thread-group .border-bottom {
    border-color: var(--border) !important;
}
.crm-contact-messages .crm-threads-sidebar #contactThreadsArchivedFilter {
    background: var(--panel-2);
    border-color: var(--border);
}
.crm-contact-messages .crm-threads-sidebar .badge {
    border: none;
}
#contactChatThread {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}
#contactChatMessages {
    flex: 1 1 0;
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}
#contactChatThread > .border-top {
    flex: 0 0 auto;
    flex-shrink: 0;
    min-height: 280px;
}
.crm-contact-messages .row {
    overflow-x: hidden;
    max-width: 100%;
}
.crm-contact-messages .ck.ck-editor {
    --ck-color-base-background: var(--panel-2);
    --ck-color-base-foreground: var(--text);
    --ck-color-base-border: var(--border);
    --ck-color-base-text: var(--text);
    --ck-color-base-focus: var(--border);
    --ck-color-panel-background: var(--panel-2);
    --ck-color-panel-border: var(--border);
    --ck-color-toolbar-background: var(--panel-2);
    --ck-color-toolbar-border: var(--border);
    --ck-color-input-background: var(--panel-2);
    --ck-color-input-border: var(--border);
    --ck-color-button-default-background: var(--border);
    --ck-color-button-default-hover-background: var(--muted);
    --ck-color-button-on-background: var(--muted);
    --ck-color-list-button-hover-background: var(--border);
    --ck-color-list-button-on-background: var(--muted);
}
.crm-contact-messages .ck.ck-editor__editable {
    background: var(--panel-2) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    min-height: 200px !important;
}
.crm-contact-messages .ck.ck-editor__editable.ck-focused {
    border-color: var(--border) !important;
    box-shadow: 0 0 0 1px var(--border);
}
.crm-contact-messages .ck.ck-toolbar {
    background: var(--panel-2) !important;
    border-color: var(--border) !important;
}
.crm-contact-messages .ck.ck-content {
    min-height: 200px !important;
}
#contactChatMessages p {
    margin: 0.5rem 0;
}
#contactChatMessages p:first-child { margin-top: 0; }
#contactChatMessages p:last-child { margin-bottom: 0; }
#contactChatMessages ul,
#contactChatMessages ol {
    margin: 0.5rem 0;
    padding-left: 1.5rem;
}
#contactChatMessages strong,
#contactChatMessages b { font-weight: 600; }
#contactChatMessages a {
    color: var(--link-color, #0d6efd);
    text-decoration: underline;
}
#contactChatMessages blockquote {
    border-left: 3px solid var(--border);
    padding-left: 1rem;
    margin: 0.5rem 0;
    color: var(--muted);
    font-style: italic;
}
#contactChatMessages h1, #contactChatMessages h2, #contactChatMessages h3,
#contactChatMessages h4, #contactChatMessages h5, #contactChatMessages h6 {
    margin: 0.75rem 0 0.5rem 0;
    font-weight: 600;
}
#contactChatMessages h1 { font-size: 1.5rem; }
#contactChatMessages h2 { font-size: 1.25rem; }
#contactChatMessages h3 { font-size: 1.1rem; }
#contactChatMessages code {
    background: var(--panel-2);
    padding: 0.125rem 0.25rem;
    border-radius: 3px;
    font-family: monospace;
}
#contactChatMessages pre {
    background: var(--panel-2);
    padding: 0.75rem;
    border-radius: var(--radius);
    overflow-x: auto;
    margin: 0.5rem 0;
}
#contactChatMessages pre code { background: transparent; padding: 0; }
#contactChatMessages hr {
    border: none;
    border-top: 1px solid var(--border);
    margin: 0.75rem 0;
}
@media (max-width: 767.98px) {
    .crm-contact-messages .crm-threads-sidebar {
        min-width: 100%;
    }
    .crm-contact-messages .row.g-2 > [class*="col-"] {
        min-height: 200px;
    }
}

.crm-dashboard .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
/* Treść boxów (Leady według statusu/sales, Projekty według sales) – wymuszenie widocznego tekstu etykiet */
.crm-dashboard .app-box .app-box-body {
    color: var(--text);
}
.crm-dashboard .app-box .app-box-body .d-flex span:first-child {
    color: var(--text);
}
/* Tytuły sekcji (boxów) – na wzór nagłówków grup w Liście projektów, mniejsza czcionka */
.crm-dashboard .card-surface .crm-dashboard-box-title {
    color: var(--sidebar-item-text);
    font-weight: 600;
    font-size: 0.95rem;
}
.crm-stat-icon {
    font-size: 2rem;
    opacity: 0.9;
}

/* Tabela „Premie dla sales” na pełną szerokość (jak w Lista projektów – ten sam układ co .reports-client-group-card) */
.crm-dashboard #crmBonusesDashboardSection .app-box-body .table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.crm-dashboard #crmBonusesDashboardSection .app-box-body .table-responsive table {
    width: 100%;
    table-layout: fixed;
    min-width: 100%;
}

/* CRM Projekty – sekcje w szarych boxach, brak scrolla na mobile */
.crm-projects {
    overflow-x: hidden;
    max-width: 100%;
}
.crm-projects-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
}
.crm-projects-section.card-surface {
    background: var(--panel-2);
}
.crm-projects-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.5rem;
    padding: 0 0.5rem;
}
@media (max-width: 767.98px) {
    .crm-projects-table-wrap {
        margin: 0 -0.25rem;
        padding: 0 0.25rem;
        overflow: visible;
    }
    /* Na mobile: tabela jako karty – brak scrolla poziomego */
    .crm-projects-table-wrap .table {
        display: block;
    }
    .crm-projects-table-wrap .table thead {
        display: none;
    }
    .crm-projects-table-wrap .table tbody {
        display: block;
    }
    .crm-projects-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.75rem 0;
    }
    .crm-projects-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .crm-projects-table-wrap .table tbody tr.crm-projects-row:hover {
        background: var(--panel-2);
    }
    .crm-projects-table-wrap .table tbody td {
        display: block;
        padding: 0.2rem 0;
        border: none;
        text-align: left;
    }
    .crm-projects-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 8rem;
        margin-right: 0.5rem;
    }
    .crm-projects-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
    .crm-projects-table-wrap .table tbody td.text-end {
        text-align: left;
    }
}
.crm-projects-row {
    cursor: pointer;
}
#crmProjectsView.crm-view {
    overflow-x: hidden;
}

/* CRM Wszystkie firmy – sekcje w szarych boxach, taby ikonki + animowany tekst, brak scrollbarów na mobile */
.crm-clients {
    overflow-x: hidden;
    max-width: 100%;
}
.crm-clients-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius, 0.375rem);
}
.crm-clients-section.card-surface {
    background: var(--panel-2);
}

/* Szczegóły firmy – boksy jak w CRM Dashboard (app-box, app-panel, card-surface) */
.crm-clients .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.crm-clients .app-box .app-box-body {
    color: var(--text);
}

/* CRM Newsletter – sekcje w szarych boxach, taby ikonki + animowany tekst, tabele responsywne */, taby ikonki + animowany tekst, tabele responsywne */
.crm-newsletter {
    overflow-x: hidden;
    max-width: 100%;
}
.crm-newsletter-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.crm-newsletter-section.card-surface {
    background: var(--panel-2);
}
.crm-bonuses-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.crm-bonuses-section.card-surface {
    background: var(--panel-2);
}
.crm-bonuses-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 767.98px) {
    .crm-bonuses-table-wrap {
        overflow: visible;
    }
    .crm-bonuses-table-wrap .table {
        display: block;
    }
    .crm-bonuses-table-wrap .table thead {
        display: none;
    }
    .crm-bonuses-table-wrap .table tbody {
        display: block;
    }
    .crm-bonuses-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.5rem 0;
    }
    .crm-bonuses-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .crm-bonuses-table-wrap .table tbody td {
        display: block;
        padding: 0.25rem 0;
        border: none;
        text-align: left;
    }
    .crm-bonuses-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 7rem;
        margin-right: 0.5rem;
    }
    .crm-bonuses-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
}
.crm-newsletter-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    border-color: var(--border);
    color: var(--muted);
}
.crm-newsletter-tabs .nav-link:hover {
    border-color: var(--border);
    color: var(--text);
}
.crm-newsletter-tabs .nav-link.active {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}
.crm-newsletter-tabs .crm-newsletter-tab-label {
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: width 0.2s ease, opacity 0.2s ease;
    margin-left: 0;
}
.crm-newsletter-tabs .nav-link.active .crm-newsletter-tab-label,
.crm-newsletter-tabs .nav-link:hover .crm-newsletter-tab-label {
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}
@media (max-width: 767.98px) {
    .crm-newsletter-tabs .crm-newsletter-tab-label {
        width: auto;
        opacity: 1;
        margin-left: 0.35rem;
    }
}
.crm-newsletter-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* Tabela w grupach newsletter – stały układ kolumn, treść się nie rozjeżdża */
.crm-newsletter-group-card .crm-newsletter-group-table {
    table-layout: fixed;
    width: 100%;
}
.crm-newsletter-group-card .crm-newsletter-group-table th,
.crm-newsletter-group-card .crm-newsletter-group-table td {
    min-width: 0;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.crm-newsletter-group-card .crm-newsletter-group-table td.text-break,
.crm-newsletter-group-card .crm-newsletter-group-table th {
    word-break: break-word;
}
@media (max-width: 767.98px) {
    .crm-newsletter-table-wrap {
        overflow: visible;
    }
    .crm-newsletter-table-wrap .table {
        display: block;
    }
    .crm-newsletter-table-wrap .table thead {
        display: none;
    }
    .crm-newsletter-table-wrap .table tbody {
        display: block;
    }
    .crm-newsletter-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.5rem 0;
    }
    .crm-newsletter-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .crm-newsletter-table-wrap .table tbody td {
        display: block;
        padding: 0.25rem 0;
        border: none;
        text-align: left;
    }
    .crm-newsletter-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 7rem;
        margin-right: 0.5rem;
    }
    .crm-newsletter-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
}
#modalNewsletterSend.modal {
    z-index: 1050 !important;
}
#modalNewsletterSend.modal.show + .modal-backdrop,
.modal-backdrop.show {
    z-index: 1040 !important;
}

/* Taby w szczegółach firmy – tylko ikonki, tekst po hover/active; pasek na pełną szerokość */
.crm-clients-details-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
    border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.12)) !important;
    padding-bottom: 0;
    margin-bottom: 0.75rem;
}
.crm-clients-details-tabs .nav-link {
    display: inline-flex;
    align-items: center;
}
.crm-clients-details-tabs .crm-clients-details-tab-label {
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: width 0.2s ease, opacity 0.2s ease;
    margin-left: 0;
}
.crm-clients-details-tabs .nav-link.active .crm-clients-details-tab-label,
.crm-clients-details-tabs .nav-link:hover .crm-clients-details-tab-label {
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}

.crm-clients-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.5rem;
    padding: 0 0.5rem;
}
#crmClientsView.crm-view {
    overflow-x: hidden;
}
/* Szczegóły klienta – treść zakładek od razu pod paskiem, bez pustej przerwy */
#clientViewBody .crm-clients-tab-content,
#clientViewBody .tab-content {
    min-height: 0;
}
#clientDetailsWrapper .tab-content {
    min-height: 0;
}
#supplierDetailsWrapper .tab-content {
    min-height: 0;
}
#clientViewBody .crm-clients-tab-content > .tab-pane,
#clientViewBody .tab-content > .tab-pane {
    padding-top: 0.25rem;
}
/* Tylko aktywna zakładka widoczna – nieaktywne panele ukryte (nie zajmują miejsca) */
#clientViewBody .crm-clients-tab-content > .tab-pane:not(.active):not(.show),
#clientViewBody .tab-content > .tab-pane:not(.active):not(.show) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
}
/* Wymuszenie ukrycia nieaktywnych paneli po ID (gdy kontekst #clientViewBody nie wystarcza) */
#client-view-details.tab-pane:not(.show),
#client-view-contacts.tab-pane:not(.show),
#client-view-projects.tab-pane:not(.show),
#client-view-history.tab-pane:not(.show) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
}
#clientViewBody .crm-clients-tab-content > .tab-pane.active.show,
#clientViewBody .tab-content > .tab-pane.active.show {
    display: block !important;
}
#client-view-details.tab-pane.show,
#client-view-contacts.tab-pane.show,
#client-view-projects.tab-pane.show,
#client-view-history.tab-pane.show {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
}
@media (max-width: 991.98px) {
    #crmClientsView.crm-view,
    .crm-clients,
    .crm-clients-table-wrap {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    #crmClientsView.crm-view::-webkit-scrollbar,
    .crm-clients::-webkit-scrollbar,
    .crm-clients-table-wrap::-webkit-scrollbar {
        display: none;
    }
    .crm-clients-table-wrap {
        margin: 0 -0.25rem;
        padding: 0 0.25rem;
    }
    /* Szczegóły klienta – brak widocznych scrollbarów */
    #clientViewBody,
    .crm-clients .tab-content,
    #clientViewHistory {
        overflow-x: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #clientViewBody::-webkit-scrollbar,
    .crm-clients .tab-content::-webkit-scrollbar,
    #clientViewHistory::-webkit-scrollbar {
        display: none;
    }
    #clientViewHistory {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
@media (max-width: 767.98px) {
    .crm-clients-table-wrap {
        overflow: visible;
    }
    /* Na mobile: tabela listy firm jako karty – brak scrolla poziomego */
    .crm-clients-table-wrap .table {
        display: block;
    }
    .crm-clients-table-wrap .table thead {
        display: none;
    }
    .crm-clients-table-wrap .table tbody {
        display: block;
    }
    .crm-clients-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.75rem 0;
    }
    .crm-clients-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .crm-clients-table-wrap .table tbody tr[data-client-id]:hover {
        background: var(--panel-2);
    }
    .crm-clients-table-wrap .table tbody td {
        display: block;
        padding: 0.2rem 0;
        border: none;
        text-align: left;
    }
    .crm-clients-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 8rem;
        margin-right: 0.5rem;
    }
    .crm-clients-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
    .crm-clients-table-wrap .table tbody td.text-center {
        text-align: left;
    }
}

/* ========== CRM Dostawcy – sekcje w szarych boxach, taby ikonki + animowany tekst ========== */
.crm-suppliers {
    overflow-x: hidden;
    max-width: 100%;
}
.crm-suppliers-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius, 0.375rem);
}
.crm-suppliers-section.card-surface {
    background: var(--panel-2);
}
.crm-suppliers-details-tabs .nav-link {
    display: inline-flex;
    align-items: center;
}
.crm-suppliers-details-tabs .crm-suppliers-tab-label {
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: width 0.2s ease, opacity 0.2s ease;
    margin-left: 0;
}
.crm-suppliers-details-tabs .nav-link.active .crm-suppliers-tab-label,
.crm-suppliers-details-tabs .nav-link:hover .crm-suppliers-tab-label {
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}
.crm-suppliers-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.5rem;
    padding: 0 0.5rem;
}
@media (max-width: 991.98px) {
    .crm-suppliers,
    .crm-suppliers-table-wrap {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .crm-suppliers::-webkit-scrollbar,
    .crm-suppliers-table-wrap::-webkit-scrollbar {
        display: none;
    }
    .crm-suppliers-table-wrap {
        margin: 0 -0.25rem;
        padding: 0 0.25rem;
    }
}
@media (max-width: 767.98px) {
    .crm-suppliers-table-wrap {
        overflow: visible;
    }
    .crm-suppliers-table-wrap .table {
        display: block;
    }
    .crm-suppliers-table-wrap .table thead {
        display: none;
    }
    .crm-suppliers-table-wrap .table tbody {
        display: block;
    }
    .crm-suppliers-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.75rem 0;
    }
    .crm-suppliers-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .crm-suppliers-table-wrap .table tbody tr[data-id]:hover {
        background: var(--panel-2);
    }
    .crm-suppliers-table-wrap .table tbody td {
        display: block;
        padding: 0.2rem 0;
        border: none;
        text-align: left;
    }
    .crm-suppliers-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 8rem;
        margin-right: 0.5rem;
    }
    .crm-suppliers-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
    .crm-suppliers-table-wrap .table tbody td.text-end {
        text-align: left;
    }
    .crm-suppliers .btn.btn-sm {
        min-height: 38px;
        min-width: 38px;
    }
}

/* Klienci (Kontrahenci) – tabela na mobile jako karty, brak scrollbarów */
.clients-view {
    overflow-x: hidden;
    max-width: 100%;
}
.clients-view .clients-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.5rem;
    padding: 0 0.5rem;
}
@media (max-width: 991.98px) {
    .clients-view,
    .clients-view .clients-table-wrap {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .clients-view::-webkit-scrollbar,
    .clients-view .clients-table-wrap::-webkit-scrollbar {
        display: none;
    }
    .clients-view .clients-table-wrap {
        margin: 0 -0.25rem;
        padding: 0 0.25rem;
    }
}
@media (max-width: 767.98px) {
    .clients-view .clients-table-wrap {
        overflow: visible;
    }
    .clients-view .clients-table-wrap .table {
        display: block;
    }
    .clients-view .clients-table-wrap .table thead {
        display: none;
    }
    .clients-view .clients-table-wrap .table tbody {
        display: block;
    }
    .clients-view .clients-table-wrap .table tbody tr {
        display: block;
        border-bottom: 1px solid var(--border);
        padding: 0.75rem 0;
    }
    .clients-view .clients-table-wrap .table tbody tr:last-child {
        border-bottom: 0;
    }
    .clients-view .clients-table-wrap .table tbody tr[data-id]:hover {
        background: var(--panel-2);
    }
    .clients-view .clients-table-wrap .table tbody td {
        display: block;
        padding: 0.2rem 0;
        border: none;
        text-align: left;
    }
    .clients-view .clients-table-wrap .table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--muted);
        display: inline-block;
        min-width: 8rem;
        margin-right: 0.5rem;
    }
    .clients-view .clients-table-wrap .table tbody td[colspan]::before {
        display: none;
    }
    .clients-view .clients-table-wrap .table tbody td.text-center {
        text-align: left;
    }
    .clients-view .clients-table-wrap .table tbody td.text-end {
        text-align: left;
    }
}

.projects-view {
    min-height: 400px;
    width: 100%;
    overflow-x: hidden;
}
.projects-section-box {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius, 0.375rem);
}
.projects-section-box.card {
    background: var(--panel-2);
    border-color: var(--border);
}
#projectsListContent .list-group-item {
    color: var(--text);
}
#projectsListContent .list-group-item strong {
    color: #e2e8f0;
    font-weight: 600;
}
#projectsListContent .list-group-item small {
    color: rgba(255, 255, 255, 0.88);
}
#projectsListContent .list-group-item .bi-chevron-right {
    color: rgba(255, 255, 255, 0.75);
}
.projects-group-header {
    padding: 0.6rem 1rem 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.6);
    border-bottom: 1px solid var(--border);
    margin-top: 0.5rem;
}
.projects-group-header:first-child {
    margin-top: 0;
}
.projects-list-item {
    cursor: pointer;
}
.projects-list-item-text {
    min-width: 0;
}
.projects-list-item-text strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.projects-list-item-actions .btn {
    opacity: 0.7;
}
.projects-list-item-actions .btn:hover {
    opacity: 1;
}
.projects-list-item-actions .projects-btn-delete {
    padding: 0.25rem 0.4rem;
}

/* Lista projektów – grupowanie jak na screenie (karta, nagłówek, tabela) */
.projects-list-groups .reports-client-group-card .reports-client-group-header .bi-person {
    color: var(--muted);
}
.projects-list-groups .reports-client-group-card .projects-group-table.table-darkish tbody tr td {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-bottom: none;
    vertical-align: middle;
}
.projects-list-groups .reports-client-group-card .projects-group-table.table-darkish tbody tr:first-child td {
    border-top: none;
}
.projects-list-groups .projects-list-row {
    cursor: pointer;
}
.projects-list-groups .projects-list-row:hover td {
    background: rgba(255, 255, 255, 0.03);
}
.projects-list-groups .td-project-name {
    font-weight: 600;
    color: #e2e8f0;
}
.projects-list-groups .td-project-actions .btn {
    opacity: 0.7;
}
.projects-list-groups .td-project-actions .btn:hover {
    opacity: 1;
}

@media (max-width: 991.98px) {
    .projects-nav-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
    }
    .projects-nav-container:not(.projects-sidebar-collapsed) .projects-nav-sidebar {
        transform: translateX(0);
    }
    .projects-nav-container:not(.projects-sidebar-collapsed) .projects-nav-backdrop {
        display: block;
    }
    .projects-nav-row {
        flex-wrap: nowrap;
    }
    .projects-content-area {
        margin-left: 0;
        width: 100%;
        min-width: 0;
    }
}



/* ========== Górna nawigacja (app_nav) – responsywność i dopracowanie ========== */

.app-header.navbar {
    padding: 0 1rem;
    min-height: 64px;
    height: auto;
}

.btn-primary {
    background: var(--brand) !important;
}

.app-header .app-header-inner {
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 64px;
}
.app-header .brand {
    flex-shrink: 0;
}
.app-header .brand .brand-logo,
.app-header .brand-logo {
    height: 1.65rem !important;
    max-height: 2rem !important;
    width: auto !important;
    max-width: 120px !important;
    object-fit: contain !important;
    vertical-align: middle;
}
.app-header .brand-name {
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Na mobile: Katalogi + hamburger poza collapse, po prawej stronie paska */
.app-header-mobile-actions {
    margin-left: auto;
}
.app-header-mobile-actions .btn-sidebar-toggle {
    white-space: nowrap;
}

/* Hamburger (mobile) – dopasowanie do ciemnego motywu */
.app-nav-toggler {
    border-color: var(--border);
    color: var(--text);
    padding: 0.35rem 0.5rem;
    font-size: 1.25rem;
}
.app-nav-toggler:hover,
.app-nav-toggler:focus {
    border-color: var(--nav-accent);
    color: var(--nav-accent);
    box-shadow: 0 0 0 1px var(--nav-accent);
}
.app-nav-toggler i {
    display: block;
}

/* Collapse: na mobile menu pod brandem */
.app-header .navbar-collapse {
    flex-grow: 0;
}
@media (max-width: 991.98px) {
    /* Header nad overlay – żeby menu było klikalne */
    .app-header {
        position: relative;
        z-index: 1060;
    }
    /* Kolejność: brand | profil/timer | Katalogi+hamburger w pierwszym wierszu; menu modułów w drugim */
    .app-header-inner {
        flex-wrap: wrap;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .app-header .brand { order: 0; }
    .app-header .hdr-right { order: 1; }
    .app-header-mobile-actions { order: 2; }
    .app-header .navbar-collapse {
        order: 3;
        flex-basis: 100%;
        position: absolute;
        top: 100%;
        left: 1rem;
        right: 1rem;
        width: auto;
        max-width: calc(100vw - 2rem);
        background: var(--panel);
        border: 1px solid var(--border);
        border-top: none;
        border-radius: 0 0 var(--radius) var(--radius);
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
        padding: 0.75rem 1rem 1rem;
        margin: 0;
        max-height: 85vh;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        transition: none !important;
        box-sizing: border-box;
        z-index: 1050;
    }
    .app-header .navbar-collapse.collapsing {
        transition: none !important;
    }
    /* Profil w headerze – na mobile tylko ikonka (lista dropdown nie znika) */
    .app-header .hdr-right .user-chip-name {
        display: none !important;
    }
    .app-header .hdr-right .session-timer {
        margin-right: 0.5rem;
    }
    .app-header .hdr-right .session-timer span {
        font-size: 0.9rem;
    }
    .app-header .navbar-collapse .nav-dropdown-section-title {
        display: block;
        font-size: 0.875rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--text);
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid var(--border);
    }
    .app-header .navbar-collapse .view-toggle-wrapper {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        margin-bottom: 0.75rem;
        padding-top: 0.25rem;
        padding-left: 1rem;
        padding-right: 1rem;
        box-sizing: border-box;
    }
    /* Jedna kolumna – wiersze idą w dół, nawigacja z tekstem */
    .app-header .navbar-collapse .view-toggle {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 0.5rem;
        width: 100%;
        box-sizing: border-box;
    }
    .app-header .navbar-collapse .view-toggle-btn {
        flex: 0 0 auto;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0.85rem 1rem;
        font-size: 1rem;
        border-radius: var(--radius);
        text-align: left;
        justify-content: flex-start;
        transition: none;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        box-sizing: border-box;
        color: var(--text);
    }
    .app-header .navbar-collapse .view-toggle-btn:not(.active):hover {
        background: var(--panel-2);
        color: var(--text);
    }
    .app-header .navbar-collapse .view-toggle-btn span {
        display: inline !important;
        width: auto !important;
        max-width: none !important;
        opacity: 1 !important;
        overflow: visible !important;
    }
    .app-header .navbar-collapse .view-toggle-btn.active {
        background: var(--panel-2);
        border: 1px solid var(--border);
        box-shadow: inset 3px 0 0 var(--text);
        color: var(--text);
    }
    /* Katalogi – tylko ikonka */
    .app-header-mobile-actions .btn-sidebar-toggle span {
        display: none !important;
    }
    .app-header-mobile-actions .btn-sidebar-toggle .ms-1 {
        display: none !important;
    }
    /* Blok język + profil w rozwijanym menu – jeden wiersz po 50% */
    .app-nav-mobile-top {
        padding: 0.5rem 0 1rem;
        margin-bottom: 0.75rem;
        border-bottom: 1px solid var(--border);
    }
    .app-nav-mobile-top-row {
        display: flex;
        flex-wrap: nowrap;
        gap: 0.5rem;
        align-items: stretch;
    }
    .app-nav-mobile-top-half {
        flex: 1 1 50%;
        min-width: 0;
    }
    .app-nav-mobile-top-half.dropdown {
        margin-bottom: 0;
    }
    .app-nav-mobile-lang-btn,
    .app-nav-mobile-user-btn {
        min-height: 48px;
        padding: 0.75rem 1rem;
        font-size: 1rem;
        color: var(--text);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        display: flex !important;
    }
    .app-nav-mobile-lang-btn:hover,
    .app-nav-mobile-user-btn:hover {
        background: var(--panel-2);
        border-color: var(--border);
        color: var(--text);
    }
    .app-nav-mobile-top .dropdown-menu .dropdown-item {
        min-height: 44px;
        padding: 0.65rem 1rem;
        font-size: 0.9375rem;
        color: var(--text);
        display: flex;
        align-items: center;
    }
    .app-nav-mobile-top .dropdown-menu {
        background: var(--panel-2);
        border: 1px solid var(--border);
    }
    /* Wiersze modułów – min. wysokość dla dotyku */
    .app-header .navbar-collapse .view-toggle-btn {
        min-height: 48px;
    }
}

/* Overlay pod menu modułów na mobile – klik zamyka menu */
.app-nav-collapse-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 1040;
}

@media (min-width: 992px) {
    .app-nav-collapse-backdrop {
        display: none !important;
    }
    .app-header-inner {
        flex-wrap: nowrap;
    }
    .app-header .brand,
    .app-header .hdr-right,
    .app-header-mobile-actions,
    .app-header .navbar-collapse {
        order: unset;
    }
    .app-header .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
        align-items: center;
        justify-content: space-between;
        flex-grow: 1;
        margin-left: 1rem;
    }
    .app-header .view-toggle-wrapper {
        flex: 1;
        justify-content: center;
    }
    .app-header .hdr-right {
        flex-shrink: 0;
    }
    .app-header .hdr-right .user-chip-name {
        display: inline !important;
    }
}

/* Dropdowny w nawigacji – ciemny motyw */
.app-header .dropdown-menu {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.app-header .dropdown-item {
    color: var(--text);
}
.app-header .dropdown-item:hover {
    background: rgba(88, 166, 255, 0.12);
    color: var(--text);
}
.app-header .dropdown-divider {
    border-color: var(--border);
}

/* ========== Sidebar (Katalogi) – responsywność ========== */

/* Desktop (lg+): węższy sidebar */
@media (min-width: 992px) {
    .sidebar {
        width: 320px !important;
        min-width: 280px !important;
        max-width: 320px !important;
        flex: 0 0 320px !important;
    }
}

/* Tablet/phone: sidebar jako drawer (wysuwany z lewej) */
@media (max-width: 991.98px) {
    .sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        height: calc(100vh - 64px);
        width: 280px;
        max-width: 85vw;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        z-index: 1040;
        box-shadow: var(--shadow);
    }

    body.sidebar-open .sidebar {
        transform: translateX(0);
    }
}

/* Backdrop przy otwartym drawerze */
.sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}

body.sidebar-open .sidebar-backdrop {
    display: block;
}

/* Blokada przewijania body gdy drawer otwarty */
body.sidebar-open {
    overflow: hidden;
}

/* Nagłówek i stopka sidebaru – obramowanie */
.sidebar .sidebar-header,
.sidebar .sidebar-footer {
    border-color: var(--border) !important;
}

/* Scrollbar sidebaru – spójny z nową paletą */
.sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(88, 166, 255, 0.25);
}
.sidebar-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(88, 166, 255, 0.45);
}

/* Pole wyszukiwania w sidebarze – dopasowanie do ciemnego tła */
.sidebar .input-group-text {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--border);
    color: var(--muted);
}
.sidebar .input-group .form-control {
    background: rgba(255, 255, 255, 0.05);
    border-color: var(--border);
    color: var(--text);
}
.sidebar .input-group .form-control::placeholder {
    color: var(--muted);
}

/* Przycisk „Pokaż archiwum” – hover bez inline; na mobile tylko ikonka */
.sidebar-archive-btn {
    font-size: 0.8rem;
    padding: 0.2rem 0.4rem;
    border: none;
    opacity: 0.7;
    transition: opacity 0.2s;
}
.sidebar-archive-btn:hover {
    opacity: 1;
}
@media (max-width: 991.98px) {
    .sidebar-archive-btn #archiveLabel {
        display: none;
    }
    .sidebar-archive-btn {
        padding: 0.35rem 0.5rem;
    }
}

/* Stopka sidebaru – mniejszy kontrast (hover w CSS zamiast inline) */
.sidebar .sidebar-footer a:hover,
.sidebar #navReleaseNotes:hover,
.sidebar #navSupport:hover,
.sidebar #navDocs:hover {
    opacity: 1;
}

.sidebar #navSupport:hover,
.sidebar #navDocs:hover {
    opacity: 0.9;
}

/* ========== Dashboard ofert – responsywność i odświeżenie ========== */

/* Wysokość kontenera wykresu */
.dashboard-chart-wrap {
    height: 280px;
    min-height: 200px;
}
@media (min-width: 768px) {
    .dashboard-chart-wrap {
        height: 300px;
    }
}

/* Zakładki statusów – scroll poziomy na mobile bez widocznych scrollbarów */
#statusTabs.status-tabs-scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
#statusTabs.status-tabs-scroll::-webkit-scrollbar {
    display: none;
}
#statusTabs.status-tabs-scroll .nav-link {
    white-space: nowrap;
}

/* Na mobile ukryte scrollbary w całej aplikacji (user-friendly) */
@media (max-width: 991.98px) {
    .app-header .navbar-collapse {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .app-header .navbar-collapse::-webkit-scrollbar {
        display: none;
    }
    .sidebar-scroll {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .sidebar-scroll::-webkit-scrollbar {
        display: none;
    }
    .dashboard-view {
        overflow-x: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .dashboard-view::-webkit-scrollbar {
        display: none;
    }
    .crm-container,
    .crm-nav-container,
    .crm-dashboard,
    .crm-content-area,
    #crmDashboardView,
    #crmClientsView {
        overflow-x: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .crm-container::-webkit-scrollbar,
    .crm-nav-container::-webkit-scrollbar,
    .crm-dashboard::-webkit-scrollbar,
    .crm-content-area::-webkit-scrollbar,
    #crmDashboardView::-webkit-scrollbar,
    #crmClientsView::-webkit-scrollbar,
    .crm-nav-sidebar .sidebar-scroll::-webkit-scrollbar {
        display: none;
    }
    .crm-nav-sidebar .sidebar-scroll {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
}

/* Karty statystyk dashboardu – spójne z resztą strony (panel, obramowanie, stonowane ikony) */
#dashboardView .row.g-3.mb-4 .card {
    border-radius: var(--radius);
    background: var(--card);
    border: 1px solid var(--border);
}
#dashboardView .row.g-3.mb-4 .card-body {
    position: relative;
    color: var(--text);
}
#dashboardView .row.g-3.mb-4 .card .text-white {
    color: var(--text) !important;
}
#dashboardView .row.g-3.mb-4 .card .text-white-50 {
    color: var(--muted) !important;
}
#dashboardView .dashboard-stat-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
    background: var(--panel-2);
    border: 1px solid var(--border);
    color: var(--text);
}
#dashboardView .dashboard-stat-icon.text-primary {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}
#dashboardView .dashboard-stat-icon.text-success {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}
#dashboardView .dashboard-stat-icon.text-danger {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}
#dashboardView .dashboard-stat-icon.text-info {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}

/* Modal folder – responsywny (dopasowany do wielkości ekranu) */
#modalFolder .modal-dialog {
    max-width: min(500px, calc(100vw - 2rem));
    margin: 1rem auto;
}
@media (max-width: 575.98px) {
    #modalFolder .modal-dialog {
        margin: 0.5rem;
        max-width: calc(100vw - 1rem);
    }
    #modalFolder .modal-content {
        max-height: calc(100vh - 1rem);
    }
}

/* Zakładki statusów – domyślnie tylko ikonki; tekst po hover/active z animacją */
.status-tabs-icons .tab-label {
    display: inline-block;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.2s ease, opacity 0.2s ease, margin-left 0.15s ease;
}
.status-tabs-icons .nav-link:hover .tab-label,
.status-tabs-icons .nav-link.active .tab-label,
.status-tabs-icons .nav-link:focus-visible .tab-label {
    max-width: 120px;
    opacity: 1;
    margin-left: 0.25rem;
}
.status-tabs-icons .nav-link .tab-badge {
    transition: margin-left 0.15s ease;
}
@media (min-width: 768px) {
    .status-tabs-icons .nav-link.active .tab-label {
        max-width: 140px;
    }
}

/* ========== Konfiguracja oferty – responsywność, brak scrollbarów, animacje zakładek ========== */

/* Kontener treści zakładek bez zewnętrznej ramki – każda sekcja w osobnym .card-surface */
#tab-config .config-tab-content {
    padding-top: 0.25rem;
    background: transparent;
    border: none;
    box-shadow: none;
}
#tab-config .config-tab-content .tab-pane {
    padding-bottom: 0.5rem;
}

/* Boxy sekcji konfiguracji – szare, bez niebieskiego odcienia */
#tab-config .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}
#tab-config .card-surface:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-config #projectClientSection,
#tab-config #projectPeopleSection {
    background: var(--panel-2);
    border-color: var(--border);
}
#tab-config #projectClientSection:hover,
#tab-config #projectPeopleSection:hover {
    background: var(--panel-2);
    border-color: var(--border);
    box-shadow: var(--shadow);
}

/* Główne zakładki oferty (mainTabs) – tylko bezpośrednie pane (bez zagnieżdżonych), tylko .active widoczny */
#offerTabsWrapper > .tab-content > .tab-pane {
    display: none !important;
}
#offerTabsWrapper > .tab-content > .tab-pane.active {
    display: block !important;
}
#offerTabsWrapper #mainTabs.pretty-tabs .nav-link .tab-label {
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
}
#offerTabsWrapper #mainTabs.pretty-tabs .nav-link:hover .tab-label,
#offerTabsWrapper #mainTabs.pretty-tabs .nav-link.active .tab-label,
#offerTabsWrapper #mainTabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px;
    opacity: 1;
    margin-left: 0.25rem;
}
/* Wewnętrzne zakładki konfiguracji (Ustawienia, Klient, Moduły, Akceptacja) – ten sam wzorzec */
#tab-config .config-inner-tabs.pretty-tabs .nav-link .tab-label {
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
}
#tab-config .config-inner-tabs.pretty-tabs .nav-link:hover .tab-label,
#tab-config .config-inner-tabs.pretty-tabs .nav-link.active .tab-label,
#tab-config .config-inner-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 160px;
    opacity: 1;
}

/* ========== Podsumowanie oferty (#tab-summary) – szare boxy, taby ikonki z animacją ========== */
#tab-summary .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}
#tab-summary .card-surface:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-summary .summary-inner-tabs.pretty-tabs .nav-link .tab-label {
    display: inline-block;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin-left 0.2s ease;
}
#tab-summary .summary-inner-tabs.pretty-tabs .nav-link:hover .tab-label,
#tab-summary .summary-inner-tabs.pretty-tabs .nav-link.active .tab-label,
#tab-summary .summary-inner-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px;
    opacity: 1;
    margin-left: 0.25rem;
}

/* Mobile: kontener oferty bez widocznych scrollbarów, przewijanie touch */
@media (max-width: 991.98px) {
    #offerTabsWrapper,
    #offerTabsWrapper .tab-content,
    #tab-config {
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
    }
    #offerTabsWrapper .tab-content {
        overflow-y: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #offerTabsWrapper .tab-content::-webkit-scrollbar {
        display: none;
    }
    #tab-config .card-surface,
    #tab-config .tab-pane {
        overflow-x: hidden;
    }
    #tab-summary .tab-content,
    #tab-summary .card-surface,
    #tab-summary .tab-pane {
        overflow-x: hidden;
    }
    #tab-summary .tab-content {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #tab-summary .tab-content::-webkit-scrollbar {
        display: none;
    }
    #tab-qa .qa-module,
    #tab-qa .card-surface,
    #tab-qa .tab-pane {
        overflow-x: hidden;
    }
}

/* ========== WBS – układ i wygląd jak Produkty (karty, sekcje, mobile) ========== */
#tab-wbs .wbs-module .wbs-section {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--panel);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
#tab-wbs .wbs-module .wbs-section:first-of-type {
    background: var(--panel-2);
}
#tab-wbs .wbs-section,
#tab-wbs .card-surface {
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-wbs .wbs-module .wbs-section.card-surface {
    background: var(--panel);
}
#tab-wbs .wbs-module .wbs-section:first-of-type.card-surface {
    background: var(--panel-2);
}
#tab-wbs .wbs-section:hover,
#tab-wbs .card-surface:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
/* Zakładki WBS (pretty-tabs): tylko ikonki, tekst po hover/active z animacją (nadpisanie styles.css) */
#tab-wbs .pretty-tabs.nav-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    width: auto !important;
    overflow: hidden;
    opacity: 0 !important;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin-left 0.2s ease;
}
#tab-wbs .pretty-tabs.nav-tabs .nav-link:hover .tab-label,
#tab-wbs .pretty-tabs.nav-tabs .nav-link.active .tab-label,
#tab-wbs .pretty-tabs.nav-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1 !important;
    margin-left: 0.25rem;
}
/* Przyciski WBS tylko ikonki (na wszystkich rozdzielczościach) */
#tab-wbs .wbs-btn-label {
    display: none !important;
}
/* Przyciski sekcji WBS – jednolity rozmiar (Dodaj + Odśwież) */
#tab-wbs .wbs-section .btn-primary,
#tab-wbs .wbs-section .btn-ghost {
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* Ramka i pasek WBS w odcieniach szarości (nadpisanie niebieskiego z styles.css) */
#tab-wbs .wbs-sticky {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    backdrop-filter: none;
}
#tab-wbs .wbs-sticky h6 i {
    color: var(--muted);
}
#tab-wbs .wbs-grid thead th {
    background: var(--panel);
    border-color: var(--border);
}
#tab-wbs .wbs-row.phase td {
    background: transparent;
    border-top-color: var(--border);
}
#tab-wbs .wbs-row.phase td:first-child {
    border-left: 4px solid var(--border);
}
#tab-wbs .wbs-row.phase td:last-child {
    border-top-right-radius: var(--radius);
}
/* Mobile: brak widocznych scrollbarów w obszarze WBS */
@media (max-width: 991.98px) {
    #tab-wbs,
    #tab-wbs .tab-content,
    #tab-wbs .card-surface,
    #tab-wbs .tab-pane,
    #tab-wbs .wbs-section {
        overflow-x: hidden;
    }
    #tab-wbs .tab-content {
        overflow-y: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #tab-wbs .tab-content::-webkit-scrollbar,
    #tab-wbs .table-responsive::-webkit-scrollbar,
    #tab-wbs .gantt-surface::-webkit-scrollbar,
    #tab-wbs .gantt-x-scroll::-webkit-scrollbar,
    #tab-wbs .wbs-summary-table-wrapper::-webkit-scrollbar {
        display: none;
    }
    #tab-wbs .gantt-surface,
    #tab-wbs .gantt-x-scroll,
    #tab-wbs .table-responsive,
    #tab-wbs .wbs-summary-table-wrapper {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    /* Tabela WBS na mobile: overflow visible żeby karty nie obcinały cieni */
    #tab-wbs .table-responsive {
        overflow-x: visible;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
    }
    /* Zwarty widok: ukrycie etykiet przy kontrolkach (tylko ikonki/kontrolki) */
    #tab-wbs .wbs-unit-label,
    #tab-wbs .wbs-sticky label.wbs-round-label,
    #tab-wbs .gantt-toolbar .gantt-scale {
        display: none;
    }
    /* WBS na mobile: układ kart z etykietami (responsive table as cards) */
    #tab-wbs .wbs-grid {
        width: 100%;
        min-width: 0;
        font-size: 0.9375rem;
    }
    #tab-wbs .wbs-grid thead {
        display: none;
    }
    #tab-wbs .wbs-grid tbody tr:not(.wbs-row) td {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0.75rem;
        border: none;
    }
    /* WBS karty na mobile: bez szarego tła, ten sam układ co Produkty/Licencje */
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase,
    #tab-wbs .wbs-grid tbody tr.wbs-row.task {
        display: grid;
        grid-template-columns: auto 1fr 1fr 1fr auto;
        gap: 0.6rem 0.5rem;
        width: 100%;
        margin-bottom: 1rem;
        padding: 0.85rem;
        background: transparent;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        box-sizing: border-box;
        align-items: start;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }
    /* Deliverable w tym samym boxie co zadanie: bez własnej karty, tylko separator od góry */
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
        width: 100%;
        margin-bottom: 0;
        margin-top: 0;
        padding: 0.85rem;
        background: transparent;
        border: none;
        border-top: 1px solid var(--border);
        border-radius: 0;
        box-sizing: border-box;
        align-items: start;
    }
    /* Zadanie z deliverable: jedna ramka – bez dolnej krawędzi przy zadaniu, zaokrąglenie u dołu tylko na ostatnim deliverable */
    #tab-wbs .wbs-grid tbody tr.wbs-row.task:has(+ tr.wbs-row.deliv) {
        margin-bottom: 0;
        border-bottom: none;
        border-radius: var(--radius) var(--radius) 0 0;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv:has(+ tr.wbs-row.task),
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv:has(+ tr.wbs-row.phase) {
        border-radius: 0 0 var(--radius) var(--radius);
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv + tr.wbs-row.task,
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv + tr.wbs-row.phase {
        margin-top: 0.75rem;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv td {
        grid-column: 1;
        padding: 0.35rem 0;
        border: none;
        background: transparent;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv textarea.form-control-sm,
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv textarea[data-f="detail_desc"],
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv .btn {
        background: transparent;
        border-color: var(--border);
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.deliv textarea[data-f="detail_desc"]:focus {
        background: transparent;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td,
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td {
        display: block;
        width: 100%;
        min-width: 0;
        padding: 0.35rem 0;
        border: none;
        box-sizing: border-box;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row td.wbs-wrap-break {
        display: none;
    }
    /* Faza: wiersz 1 = tytuł (2/span 4) + akcje (col 5) */
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td.wbs-phase-title-cell {
        grid-column: 1 / span 4;
        grid-row: 1;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid var(--border);
        margin-bottom: 0.15rem;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:last-child {
        grid-column: 5;
        grid-row: 1;
        padding: 0;
        border: none;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:last-child::before {
        display: none;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(3) { grid-column: 2; grid-row: 2; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(4) { grid-column: 3; grid-row: 2; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(5) { grid-column: 4; grid-row: 2; }
    /* Faza: MD (bez buf.) i MD (z buf.) w jednym wierszu */
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(6) { grid-column: 2; grid-row: 3; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(7) { grid-column: 3; grid-row: 3; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(9) { grid-column: 2 / span 3; grid-row: 4; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.phase td:nth-child(10) { grid-column: 2 / span 3; grid-row: 5; }
    /* Zadanie: wiersz 1 = tytuł + akcje */
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td.wbs-task-title-cell {
        grid-column: 1 / span 4;
        grid-row: 1;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid var(--border);
        margin-bottom: 0.15rem;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:last-child {
        grid-column: 5;
        grid-row: 1;
        padding: 0;
        border: none;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:last-child::before {
        display: none;
    }
    /* Zadanie: MD (bez buf.) i MD (z buf.) w jednym wierszu */
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:nth-child(2) { grid-column: 2; grid-row: 2; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:nth-child(3) { grid-column: 3; grid-row: 2; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:nth-child(5) { grid-column: 2 / span 3; grid-row: 3; }
    #tab-wbs .wbs-grid tbody tr.wbs-row.task td:nth-child(6) { grid-column: 2 / span 3; grid-row: 4; }
    /* Etykiety pól – ten sam styl co Produkty/Licencje */
    #tab-wbs .wbs-grid tbody tr.wbs-row td[data-label]:not([data-label=""]):not(.wbs-wrap-break):not(.wbs-phase-title-cell):not(.wbs-task-title-cell)::before {
        content: attr(data-label);
        font-weight: 600;
        display: block;
        margin-bottom: 0.25rem;
        color: var(--muted);
        font-size: 0.75rem;
        letter-spacing: 0.02em;
    }
    /* Wąski uchwyt drag i przycisk menu – bez szarego tła */
    #tab-wbs .wbs-grid tbody tr.wbs-row .row-title .handle,
    #tab-wbs .wbs-grid tbody tr.wbs-row .row-title .collapse-toggle {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row .row-title .handle i,
    #tab-wbs .wbs-grid tbody tr.wbs-row .row-title .collapse-toggle i {
        font-size: 0.9rem;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row td .row-actions .btn {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row td .row-actions .btn i {
        font-size: 0.9rem;
    }
    #tab-wbs .wbs-grid tbody tr.wbs-row td .row-actions {
        display: flex;
        justify-content: flex-end;
    }
    /* Pola i opcje bez szarego tła */
    #tab-wbs .wbs-grid tbody tr.wbs-row input.form-control-sm,
    #tab-wbs .wbs-grid tbody tr.wbs-row select.form-select-sm,
    #tab-wbs .wbs-grid tbody tr.wbs-row textarea.form-control-sm,
    #tab-wbs .wbs-grid tbody tr.wbs-row .editable-field .editable-display,
    #tab-wbs .wbs-grid tbody tr.wbs-row .editable-field input,
    #tab-wbs .wbs-grid tbody tr.wbs-row .editable-field select,
    #tab-wbs .wbs-grid tbody tr.wbs-row .editable-field textarea {
        background: transparent;
        border-color: var(--border);
    }
    /* Ikonka ołówka – mniej widoczna, pełna przy focus/hover (jak Licencje) */
    #tab-wbs .wbs-grid .editable-field .editable-icon {
        opacity: 0.4;
    }
    #tab-wbs .wbs-grid .editable-field:focus-within .editable-icon,
    #tab-wbs .wbs-grid .editable-field .editable-display:hover .editable-icon {
        opacity: 1;
    }
    #tab-wbs .wbs-grid .wbs-date-range {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    #tab-wbs .wbs-grid input[type="date"] {
        min-width: 0;
        flex: 1 1 0;
    }
}

/* ========== Licencje (#tab-lic) – układ i wygląd jak Produkty (karty, sekcje, mobile) ========== */
#tab-lic .licenses-module .licenses-section {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--panel);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
#tab-lic .licenses-module .licenses-section:first-of-type {
    background: var(--panel-2);
}
#tab-lic .licenses-module .licenses-section.card-surface {
    background: var(--panel);
}
#tab-lic .licenses-module .licenses-section:first-of-type.card-surface {
    background: var(--panel-2);
}
#tab-lic .card-surface {
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-lic .licenses-module .licenses-section.card-surface:hover,
#tab-lic .card-surface:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-lic .pretty-tabs.nav-tabs .nav-link .tab-label {
    white-space: nowrap;
    overflow: hidden;
    transition: max-width 0.25s ease, opacity 0.25s ease;
}
#tab-lic .pretty-tabs.nav-tabs .nav-link:not(.active) .tab-label {
    max-width: 0;
    opacity: 0;
    margin: 0;
    padding: 0;
}
#tab-lic .pretty-tabs.nav-tabs .nav-link.active .tab-label {
    max-width: 180px;
    opacity: 1;
    margin-left: 0.25rem;
}

/* ========== Usługi – sekcja wariantów jak WBS (układ, styl, przyciski) ========== */
#tab-services .services-section {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--panel-2);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
#tab-services .services-section:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-services .services-btn-label {
    display: none !important;
}
/* Przyciski sekcji – ten sam rozmiar i styl co WBS (zaokrąglone prostokąty, tylko ikony) */
#tab-wbs .services-section .btn-primary,
#tab-wbs .services-section .btn-ghost {
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#tab-services .services-section .btn-primary {
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}
#tab-services .services-section .btn-primary:hover {
    background: #8bb0ff;
    border-color: #8bb0ff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(122, 162, 255, 0.3);
}
#tab-services .services-section .btn-ghost {
    border: 1.5px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.05);
    color: var(--text);
}
#tab-services .services-section .btn-ghost:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(122, 162, 255, 0.4);
    color: var(--text);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Zakładki Usług (pretty-tabs): tylko ikonki, tekst po hover/active – jak WBS */
#tab-services .pretty-tabs.nav-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    width: auto !important;
    overflow: hidden;
    opacity: 0 !important;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin-left 0.2s ease;
}
#tab-services .pretty-tabs.nav-tabs .nav-link:hover .tab-label,
#tab-services .pretty-tabs.nav-tabs .nav-link.active .tab-label,
#tab-services .pretty-tabs.nav-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1 !important;
    margin-left: 0.25rem;
}

/* Usunięcie listwy z aktywnej karty wariantu – spójność z WBS */
#tab-services #srvVariantsList .list-group-item.active::before {
    display: none;
}

/* Karty wariantów usług – identyczny styl graficzny jak #wbsVariantsList */
#tab-services #srvVariantsList .list-group-item {
    background: rgba(255, 255, 255, 0.03);
    border: 1.5px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    transition: all 0.3s ease;
    margin-bottom: 0.5rem;
}
#tab-services #srvVariantsList .list-group-item:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(122, 162, 255, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
#tab-services #srvVariantsList .list-group-item.active {
    background: rgba(122, 162, 255, 0.12);
    border-color: rgba(122, 162, 255, 0.4);
    box-shadow: 0 2px 8px rgba(122, 162, 255, 0.2);
}

/* Ikona w karcie (siatka 3×3) – ten sam kolor i wygląd co w WBS */
#tab-services #srvVariantsList .offer-icon,
#tab-services #srvVariantsList .offer-icon i {
    color: #c7d2fe;
}
#tab-services #srvVariantsList .offer-icon {
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.4);
}

/* Uchwyt przeciągania – wizualnie jak ikona (okrąg, ten sam styl co .offer-icon) */
#tab-services #srvVariantsList .drag-handle {
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.4);
    padding: 0;
    opacity: 1;
    color: #c7d2fe;
}
#tab-services #srvVariantsList .drag-handle:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(148, 163, 184, 0.5);
    color: #c7d2fe;
    opacity: 1;
}
#tab-services #srvVariantsList .drag-handle i {
    font-size: 1rem;
    color: #c7d2fe;
}

/* Uchwyt przeciągania w WBS – ten sam wygląd co w Usługach */
#tab-wbs #wbsVariantsList .drag-handle {
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.4);
    padding: 0;
    opacity: 1;
    color: #c7d2fe;
}
#tab-wbs #wbsVariantsList .drag-handle:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(148, 163, 184, 0.5);
    color: #c7d2fe;
    opacity: 1;
}
#tab-wbs #wbsVariantsList .drag-handle i {
    font-size: 1rem;
    color: #c7d2fe;
}

/* Przyciski w sekcji wariantów – ten sam styl co WBS */
#tab-lic .licenses-variants-section .btn-primary,
#tab-hw .offers-products-variants-section .btn-primary {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
    border-radius: 10px;
    padding: 0.5rem 1rem;
    font-weight: 500;
    transition: all 0.2s ease;
}
#tab-lic .licenses-variants-section .btn-primary:hover,
#tab-hw .offers-products-variants-section .btn-primary:hover {
    background: #8bb0ff;
    border-color: #8bb0ff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(122, 162, 255, 0.3);
}
#tab-lic .licenses-variants-section .btn-ghost,
#tab-hw .offers-products-variants-section .btn-ghost {
    border: 1.5px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.05);
    color: var(--text);
    border-radius: 10px;
    padding: 0.5rem 1rem;
    transition: all 0.2s ease;
    font-weight: 500;
}
#tab-lic .licenses-variants-section .btn-ghost:hover,
#tab-hw .offers-products-variants-section .btn-ghost:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(122, 162, 255, 0.4);
    color: var(--text);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Zakładka Finanse w Produktach – zminimalizowana jak Warianty sprzętu (jeden box, zwarte statystyki) */
#tab-hw .offers-products-finance-section {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-hw .offers-products-finance-section:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-hw .offers-products-finance-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: stretch;
}
#tab-hw .offers-products-stat-chip {
    display: inline-flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1.5px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    min-width: 0;
    transition: border-color 0.2s ease, background 0.2s ease;
}
#tab-hw .offers-products-stat-chip:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(122, 162, 255, 0.25);
}
#tab-hw .offers-products-stat-chip .label {
    font-size: 0.7rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
#tab-hw .offers-products-stat-chip .val {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--text);
}

/* Karty wariantów w Licencjach i Produktach – ten sam styl co WBS (#wbsVariantsList) */
#tab-lic #variantsList .list-group-item,
#tab-hw #hwVariantsList .list-group-item {
    background: rgba(255, 255, 255, 0.03);
    border: 1.5px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 0.75rem 1rem;
    transition: all 0.3s ease;
    margin-bottom: 0.5rem;
}
#tab-lic #variantsList .list-group-item:hover,
#tab-hw #hwVariantsList .list-group-item:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(122, 162, 255, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
#tab-lic #variantsList .list-group-item.active,
#tab-hw #hwVariantsList .list-group-item.active {
    background: rgba(122, 162, 255, 0.12);
    border-color: rgba(122, 162, 255, 0.4);
    box-shadow: 0 2px 8px rgba(122, 162, 255, 0.2);
}
/* Usunięcie gradientu i listwy z unifikowanego stylu – spójność z WBS */
#tab-lic #variantsList .list-group-item.active::before,
#tab-hw #hwVariantsList .list-group-item.active::before {
    display: none;
}

@media (max-width: 991.98px) {
    #tab-lic,
    #tab-lic .tab-content,
    #tab-lic .card-surface,
    #tab-lic .tab-pane {
        overflow-x: hidden;
    }
    #tab-lic .lic-table-responsive {
        overflow-x: visible;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #tab-lic .lic-table-responsive::-webkit-scrollbar {
        display: none;
    }
    #tab-lic .btn-text-mobile-hide,
    #tab-lic .licenses-btn-text {
        display: none !important;
    }
    #tab-lic .lic-add-item-text {
        display: none !important;
    }
    #tab-lic .licenses-module .licenses-section,
    #tab-lic .licenses-table-wrap {
        overflow-x: hidden;
    }
    /* Licencje na mobile: tabela jako karty – kolejność: Nazwa, Ilość/Cena zak., Marża/Cena sprz., Waluta/Opcje */
    #tab-lic .lic-table .table {
        width: 100%;
        min-width: 0;
        font-size: 0.9375rem;
    }
    #tab-lic .lic-table .table thead {
        display: none;
    }
    /* Grid: tylko kolumna nazwy jest szersza (Bootstrap-like: col-auto, col, col, col, col-auto) */
    #tab-lic .lic-table tbody tr.lic-row {
        display: grid;
        grid-template-columns: auto 1fr 1fr 1fr auto;
        gap: 0.6rem 0.5rem;
        width: 100%;
        margin-bottom: 1rem;
        padding: 0.85rem;
        background: transparent;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        box-sizing: border-box;
        align-items: start;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }
    #tab-lic .lic-table tbody tr.lic-row td {
        display: block;
        width: 100%;
        min-width: 0;
        padding: 0.4rem 0;
        border: none;
        box-sizing: border-box;
    }
    /* Wiersz 1: wąski uchwyt | szeroka nazwa | wąski przycisk akcji */
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-drag {
        grid-column: 1;
        grid-row: 1;
        padding: 0;
        width: auto;
        min-width: 0;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-drag .btn {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-drag .btn i {
        font-size: 0.9rem;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-drag[data-label=""]::before {
        display: none;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-product {
        grid-column: 2 / span 3;
        grid-row: 1;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid var(--border);
        margin-bottom: 0.15rem;
        min-width: 0;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-actions {
        grid-column: 5;
        grid-row: 1;
        padding: 0;
        border: none;
        margin: 0;
        width: auto;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-actions .btn {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-actions .btn i {
        font-size: 0.9rem;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-actions::before {
        display: none;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-actions .row-actions {
        margin-left: 0;
    }
    /* Wiersz 2: Ilość, Cena zak. (szt), Cena zak. (suma) – równe kolumny, bez szarego tła */
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(3) {
        grid-column: 2;
        grid-row: 2;
    }
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(4) {
        grid-column: 3;
        grid-row: 2;
    }
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(5) {
        grid-column: 4;
        grid-row: 2;
    }
    /* Wiersz 3: Marża, Cena sprz. (szt), Cena sprz. (suma) */
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(6) {
        grid-column: 2;
        grid-row: 3;
    }
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(7) {
        grid-column: 3;
        grid-row: 3;
    }
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(8) {
        grid-column: 4;
        grid-row: 3;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-group-start {
        border-left: 2px solid var(--border);
    }
    /* Wiersz 4: Waluta (środkowe kolumny, jak pola powyżej) */
    #tab-lic .lic-table tbody tr.lic-row td:nth-child(9) {
        grid-column: 2 / span 3;
        grid-row: 4;
    }
    /* Pola tylko do odczytu (sumy) – bez mocnego kafelka, pogrubienie i mniejsza etykieta */
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-sum {
        font-weight: 600;
        padding: 0.35rem 0;
    }
    #tab-lic .lic-table tbody tr.lic-row td.lic-cell-sum::before {
        color: var(--muted);
        font-size: 0.7rem;
    }
    /* Etykiety pól */
    #tab-lic .lic-table tbody tr.lic-row td[data-label]:not([data-label=""])::before {
        content: attr(data-label);
        font-weight: 600;
        display: block;
        margin-bottom: 0.25rem;
        color: var(--muted);
        font-size: 0.75rem;
        letter-spacing: 0.02em;
    }
    /* Ikonka ołówka – mniej widoczna domyślnie, pełna przy focus/hover */
    #tab-lic .lic-table .editable-field .editable-icon {
        opacity: 0.4;
    }
    #tab-lic .lic-table .editable-field:focus-within .editable-icon,
    #tab-lic .lic-table .editable-field .editable-display:hover .editable-icon {
        opacity: 1;
    }
    #tab-lic .lic-table tbody tr:not(.lic-row):not(.new-row) {
        display: block;
    }
    #tab-lic .lic-table tbody tr:not(.lic-row):not(.new-row) td {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0.75rem;
        border: none;
    }
    #tab-lic .lic-table tbody tr.new-row {
        display: block;
        margin-bottom: 1rem;
    }
    #tab-lic .lic-table tbody tr.new-row td {
        display: block;
        width: 100%;
        padding: 0.6rem;
        border: none;
    }
    #tab-lic .lic-table tbody tr.new-row .btn {
        border-radius: var(--radius);
        padding: 0.65rem 1rem;
    }
    #tab-lic .lic-table tfoot tr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        padding: 0.65rem 0.85rem;
        background: var(--panel-2);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        margin-top: 0.35rem;
    }
    #tab-lic .lic-table tfoot td {
        display: block;
        padding: 0;
        border: none;
        text-align: left;
    }
    #tab-lic .lic-table tfoot td:empty {
        display: none;
    }
    #tab-lic .lic-table tfoot td.fw-bold {
        font-size: 1.05rem;
        color: var(--accent);
    }
    #tab-lic .lic-table tbody tr.lic-row input.form-control-sm,
    #tab-lic .lic-table tbody tr.lic-row select.form-select-sm {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        background: transparent;
        border-color: var(--border);
    }
    /* Bez szarego tła pod przyciskiem „z katalogu” */
    #tab-lic .lic-table tbody tr.lic-row .lic-name-inner .lic-pick-btn {
        background: transparent;
        border-color: var(--border);
    }
    #tab-lic .lic-table tbody tr.lic-row .lic-name-inner .lic-pick-btn:hover {
        background: rgba(255, 255, 255, 0.06);
    }
}

/* Kolumna break (łamanie wiersza na mobile) – na desktopie niewidoczna */
#tab-wbs .wbs-grid .wbs-wrap-break-th {
    width: 0;
    min-width: 0;
    padding: 0;
    border: none;
    overflow: hidden;
}
/* Tabele WBS i ról – czytelne obramowanie */
#tab-wbs .wbs-grid {
    table-layout: fixed;
}
#tab-wbs .wbs-grid,
#tab-wbs .roles-grid {
    border-color: var(--border);
}
#tab-wbs .wbs-grid thead th,
#tab-wbs .roles-grid thead th {
    background: var(--panel);
    color: var(--text);
    border-color: var(--border);
}
#tab-wbs .wbs-grid tbody td,
#tab-wbs .roles-grid tbody td {
    border-color: var(--border);
}
/* Tabela ról – ciemne tło i czytelny tekst (nadpisanie białego z Bootstrap/theme) */
#tab-wbs .roles-grid tbody td,
#tab-wbs .roles-grid tr.roles-row td {
    background: var(--panel-2);
    color: var(--text);
}
#tab-wbs .roles-grid tr.roles-row:hover td {
    background: rgba(255, 255, 255, 0.06);
}
#tab-wbs .roles-grid tr.roles-row input,
#tab-wbs .roles-grid tr.roles-row .form-control {
    background: var(--panel);
    border-color: var(--border);
    color: var(--text);
}
#tab-wbs .roles-grid tr.roles-row input::placeholder {
    color: var(--muted);
}
#tab-wbs .roles-grid tr.roles-row .editable-display,
#tab-wbs .roles-grid tr.roles-row .editable-text {
    color: var(--text);
}

/* Założenia & Wykluczenia (WBS) – odcienie szarości zamiast niebieskiego */
#wbs-pane-clauses .clauses-head-icon {
    color: var(--text);
}
#wbs-pane-clauses .clauses-grid thead th {
    background: var(--panel);
    color: var(--text);
    border-color: var(--border);
}
#wbs-pane-clauses .clauses-grid .new-row td {
    border-top-color: var(--border);
}
#wbs-pane-clauses .clauses-grid .form-control:hover,
#wbs-pane-clauses .clauses-grid .form-select:hover,
#wbs-pane-clauses .clauses-grid textarea:hover {
    border-color: var(--border);
    background: rgba(255, 255, 255, 0.06);
}
#wbs-pane-clauses .clauses-grid .form-control:focus,
#wbs-pane-clauses .clauses-grid .form-select:focus,
#wbs-pane-clauses .clauses-grid textarea:focus {
    border-color: var(--border);
    background: var(--panel-2);
}
#wbs-pane-clauses .clauses-grid .row-actions .btn-primary {
    background: var(--panel-2);
    border-color: var(--border);
    color: var(--text);
}
#wbs-pane-clauses .clauses-grid .row-actions .btn-primary:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--border);
    color: var(--text);
}

#tab-wbs .gantt-surface {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--panel-2);
}

/* Diagram WBS (draw.io) – pełna szerokość, brak obcinania po odświeżeniu */
#wbs-pane-diagram .wbs-diagram-host {
    width: 100%;
    min-width: 0;
    overflow: auto;
    box-sizing: border-box;
}
#wbs-pane-diagram .wbs-diagram-frame {
    width: 100% !important;
    box-sizing: border-box;
}

/* Modale w kontekście oferty – dopasowanie do wielkości strony */
#offerTabsWrapper .modal-dialog,
.modal-dialog.modal-dialog--fit {
    max-width: min(560px, calc(100vw - 2rem));
    margin: 1rem auto;
}
@media (max-width: 575.98px) {
    #offerTabsWrapper .modal-dialog,
    .modal-dialog.modal-dialog--fit {
        margin: 0.5rem;
        max-width: calc(100vw - 1rem);
    }
    #offerTabsWrapper .modal-content,
    .modal-dialog.modal-dialog--fit .modal-content {
        max-height: calc(100vh - 1rem);
    }
}

/* Selecty w konfiguracji – spójny wygląd */
#tab-config .form-select {
    border-radius: var(--radius);
    border-color: var(--border);
}
#tab-config .form-select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 1px var(--brand);
}

/* ========== Katalog usług (Usługi) ========== */
.services-catalog-wrapper {
    min-height: 0;
}
.services-catalog-list-box,
.services-catalog-detail-box {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}
.services-catalog-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 991.98px) {
    .services-catalog-wrapper,
    .services-catalog-list-box,
    .services-catalog-detail-box {
        overflow-x: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .services-catalog-wrapper::-webkit-scrollbar,
    .services-catalog-list-box::-webkit-scrollbar,
    .services-catalog-detail-box::-webkit-scrollbar,
    .services-catalog-table-wrap::-webkit-scrollbar {
        display: none;
    }
}
/* Zakładki szczegółów usługi – ikonki + animacja tekstu */
.services-catalog-detail-box .pretty-tabs.nav-tabs .nav-link .tab-label {
    display: inline-block;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin-left 0.2s ease;
}
.services-catalog-detail-box .pretty-tabs.nav-tabs .nav-link:hover .tab-label,
.services-catalog-detail-box .pretty-tabs.nav-tabs .nav-link.active .tab-label,
.services-catalog-detail-box .pretty-tabs.nav-tabs .nav-link:focus-visible .tab-label {
    max-width: 140px;
    opacity: 1;
    margin-left: 0.25rem;
}
/* Modal Usługi – dopasowany do ekranu, większy dla formularza */
#modalSrv .modal-dialog.modal-dialog--fit,
#modalLicCatalog .modal-dialog.modal-dialog--fit,
#modalLicPicker .modal-dialog.modal-dialog--fit {
    max-width: min(900px, calc(100vw - 2rem));
}
@media (max-width: 575.98px) {
    #modalSrv .modal-dialog.modal-dialog--fit {
        margin: 0.5rem;
        max-width: calc(100vw - 1rem);
    }
    #modalSrv .modal-content {
        max-height: calc(100vh - 1rem);
    }
}
/* Przyciski: na mobile tylko ikonki */
@media (max-width: 991.98px) {
    .btn-icon-text .btn-text {
        display: none !important;
    }
    .btn-icon-text.ms-1 {
        margin-left: 0 !important;
    }
}

/* ========== Moduł Usługi (w ofercie) – szare tabele ========== */
#srv-pane-warunki .clauses-grid thead th,
#srv-pane-zakres .clauses-grid thead th,
#srv-pane-wykluczenia .clauses-grid thead th {
    background: var(--panel) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
#srv-pane-warunki .clauses-grid tbody tr td,
#srv-pane-zakres .clauses-grid tbody tr td,
#srv-pane-wykluczenia .clauses-grid tbody tr td {
    background: var(--panel-2) !important;
    border-color: var(--border) !important;
}
#srv-pane-warunki .clauses-grid tbody tr:hover td,
#srv-pane-zakres .clauses-grid tbody tr:hover td,
#srv-pane-wykluczenia .clauses-grid tbody tr:hover td {
    background: rgba(255, 255, 255, 0.04) !important;
}
#srv-pane-warunki .clauses-grid .new-row td,
#srv-pane-zakres .clauses-grid .new-row td,
#srv-pane-wykluczenia .clauses-grid .new-row td {
    background: var(--panel-2) !important;
    border-top: 1px dashed var(--border) !important;
}
#srv-pane-warunki .clauses-grid .form-control,
#srv-pane-warunki .clauses-grid .form-select,
#srv-pane-warunki .clauses-grid textarea,
#srv-pane-zakres .clauses-grid .form-control,
#srv-pane-zakres .clauses-grid .form-select,
#srv-pane-zakres .clauses-grid textarea,
#srv-pane-wykluczenia .clauses-grid .form-control,
#srv-pane-wykluczenia .clauses-grid .form-select,
#srv-pane-wykluczenia .clauses-grid textarea {
    background: var(--panel-2) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
}
#srv-pane-warunki .clauses-grid .form-control:hover,
#srv-pane-warunki .clauses-grid .form-select:hover,
#srv-pane-warunki .clauses-grid textarea:hover,
#srv-pane-zakres .clauses-grid .form-control:hover,
#srv-pane-zakres .clauses-grid .form-select:hover,
#srv-pane-zakres .clauses-grid textarea:hover,
#srv-pane-wykluczenia .clauses-grid .form-control:hover,
#srv-pane-wykluczenia .clauses-grid .form-select:hover,
#srv-pane-wykluczenia .clauses-grid textarea:hover {
    border-color: var(--border) !important;
    background: rgba(255, 255, 255, 0.06) !important;
}
#srv-pane-warunki .clauses-grid .form-control:focus,
#srv-pane-warunki .clauses-grid .form-select:focus,
#srv-pane-warunki .clauses-grid textarea:focus,
#srv-pane-zakres .clauses-grid .form-control:focus,
#srv-pane-zakres .clauses-grid .form-select:focus,
#srv-pane-zakres .clauses-grid textarea:focus,
#srv-pane-wykluczenia .clauses-grid .form-control:focus,
#srv-pane-wykluczenia .clauses-grid .form-select:focus,
#srv-pane-wykluczenia .clauses-grid textarea:focus {
    border-color: var(--brand) !important;
    background: var(--panel-2) !important;
}
#srv-pane-warunki .clauses-grid .editable-display,
#srv-pane-zakres .clauses-grid .editable-display,
#srv-pane-wykluczenia .clauses-grid .editable-display {
    background: rgba(15, 23, 42, .08) !important;
    border: none !important;
    color: var(--text) !important;
}
#srv-pane-warunki .clauses-grid .editable-display:hover,
#srv-pane-zakres .clauses-grid .editable-display:hover,
#srv-pane-wykluczenia .clauses-grid .editable-display:hover {
    background: rgba(15, 23, 42, .12) !important;
}
/* Scrollbary na mobile – pane usług (oferta) */
@media (max-width: 991.98px) {
    #srv-pane-warunki,
    #srv-pane-zakres,
    #srv-pane-wykluczenia,
    #srv-pane-uslugi {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #srv-pane-warunki::-webkit-scrollbar,
    #srv-pane-zakres::-webkit-scrollbar,
    #srv-pane-wykluczenia::-webkit-scrollbar,
    #srv-pane-uslugi::-webkit-scrollbar {
        display: none;
    }
}

/* ========== offers_products (Sprzęt / Produkty w ofercie) ========== */
.offers-products-module .offers-products-section {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--panel);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.offers-products-module .offers-products-section:first-of-type {
    background: var(--panel-2);
}
.offers-products-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--radius);
}
@media (max-width: 991.98px) {
    .offers-products-btn-text {
        display: none !important;
    }
    .offers-products-table-wrap {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .offers-products-table-wrap::-webkit-scrollbar {
        display: none;
    }
}

/* Taby offers_products (Produkty / Finanse): ikonka + tekst zawsze widoczny (jak w innych tabach) */
.offers-products-tabs .nav-link .tab-label {
    opacity: 1;
    max-width: none;
    overflow: visible;
    white-space: nowrap;
    transition: opacity 0.2s ease, color 0.2s ease;
}
.offers-products-tabs .nav-link:hover .tab-label,
.offers-products-tabs .nav-link.active .tab-label {
    opacity: 1;
    max-width: none;
}
@media (max-width: 991.98px) {
    #offerTabsWrapper #mainTabs.pretty-tabs .nav-link .tab-label {
        display: none;
    }
    #offerTabsWrapper #mainTabs.pretty-tabs .nav-link.active .tab-label {
        display: inline;
        max-width: none;
        opacity: 1;
    }
    .offers-products-tabs .nav-link .tab-label {
        display: none;
    }
    .offers-products-tabs .nav-link.active .tab-label {
        display: inline;
        max-width: none;
        opacity: 1;
    }
}

/* offers_products: tabela jako karty na mobile (wzorzec z #tab-lic) */
@media (max-width: 991.98px) {
    #tab-hw .offers-products-table-wrap,
    #tab-hw .offers-products-module .offers-products-section {
        overflow-x: hidden;
    }
    #tab-hw .offers-products-table-wrap .table {
        width: 100%;
        min-width: 0;
        font-size: 0.9375rem;
    }
    #tab-hw .offers-products-table-wrap .table thead {
        display: none;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row {
        display: grid;
        grid-template-columns: auto 1fr 1fr 1fr auto;
        gap: 0.6rem 0.5rem;
        width: 100%;
        margin-bottom: 1rem;
        padding: 0.85rem;
        background: transparent;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        box-sizing: border-box;
        align-items: start;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td {
        display: block;
        width: 100%;
        min-width: 0;
        padding: 0.4rem 0;
        border: none;
        box-sizing: border-box;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-drag {
        grid-column: 1;
        grid-row: 1;
        padding: 0;
        width: auto;
        min-width: 0;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-drag .btn {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-drag .btn i {
        font-size: 0.9rem;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-drag[data-label=""]::before {
        display: none;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-product {
        grid-column: 2 / span 3;
        grid-row: 1;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid var(--border);
        margin-bottom: 0.15rem;
        min-width: 0;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-actions {
        grid-column: 5;
        grid-row: 1;
        padding: 0;
        width: auto;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-actions .btn {
        padding: 0.2rem 0.35rem;
        min-width: 0;
        background: transparent;
        border-color: transparent;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-actions .btn i {
        font-size: 0.9rem;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-actions .row-actions {
        margin-left: 0;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-actions::before {
        display: none;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(3) {
        grid-column: 2;
        grid-row: 2;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(4) {
        grid-column: 3;
        grid-row: 2;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(5) {
        grid-column: 4;
        grid-row: 2;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(6) {
        grid-column: 2;
        grid-row: 3;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(7) {
        grid-column: 3;
        grid-row: 3;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(8) {
        grid-column: 4;
        grid-row: 3;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td:nth-child(9) {
        grid-column: 2 / span 3;
        grid-row: 4;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td.lic-cell-sum::before {
        color: var(--muted);
        font-size: 0.7rem;
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row td[data-label]:not([data-label=""])::before {
        content: attr(data-label);
        font-weight: 600;
        display: block;
        margin-bottom: 0.25rem;
        color: var(--muted);
        font-size: 0.75rem;
        letter-spacing: 0.02em;
    }
    #tab-hw .offers-products-table-wrap .editable-field .editable-icon {
        opacity: 0.4;
    }
    #tab-hw .offers-products-table-wrap .editable-field:focus-within .editable-icon,
    #tab-hw .offers-products-table-wrap .editable-field .editable-display:hover .editable-icon {
        opacity: 1;
    }
    #tab-hw .offers-products-table-wrap tbody tr:not(.lic-row):not(.new-row) {
        display: block;
    }
    #tab-hw .offers-products-table-wrap tbody tr:not(.lic-row):not(.new-row) td {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0.75rem;
        border: none;
    }
    #tab-hw .offers-products-table-wrap tbody tr.new-row {
        display: block;
        margin-bottom: 1rem;
    }
    #tab-hw .offers-products-table-wrap tbody tr.new-row td {
        display: block;
        width: 100%;
        padding: 0.6rem;
        border: none;
    }
    #tab-hw .offers-products-table-wrap tbody tr.new-row .btn {
        border-radius: var(--radius);
        padding: 0.65rem 1rem;
    }
    #tab-hw .offers-products-table-wrap tfoot tr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        padding: 0.65rem 0.85rem;
        background: var(--panel-2);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        margin-top: 0.35rem;
    }
    #tab-hw .offers-products-table-wrap tfoot td {
        display: block;
        padding: 0;
        border: none;
        text-align: left;
    }
    #tab-hw .offers-products-table-wrap tfoot td:empty {
        display: none;
    }
    #tab-hw .offers-products-table-wrap tfoot td.fw-bold {
        font-size: 1.05rem;
        color: var(--accent);
    }
    #tab-hw .offers-products-table-wrap tbody tr.lic-row input.form-control-sm,
    #tab-hw .offers-products-table-wrap tbody tr.lic-row select.form-select-sm {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* Modale – dopasowanie do wielkości ekranu */
@media (max-width: 576px) {
    .modal-dialog {
        max-width: min(90vw, 100%);
        margin: 0.5rem auto;
    }
    .modal-dialog.modal-lg {
        max-width: min(90vw, 100%);
    }
}

/* ========== Dokumentacja & Notatki (moduł offers_docs) ========== */
#tab-docs .docs-section-heading {
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text);
    margin-bottom: 0.15rem;
}
#tab-docs .docs-section-heading i {
    color: var(--brand);
    font-size: 1rem;
}
#tab-docs .docs-section-modern {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#tab-docs .docs-section-modern:hover {
    border-color: var(--brand);
    box-shadow: var(--shadow);
}
#tab-docs .docs-list-modern {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
#tab-docs .docs-item-modern,
.docs-item-modern {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    position: relative;
}
#tab-docs .docs-item-modern:hover,
.docs-item-modern:hover {
    border-color: var(--brand);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.docs-item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}
.docs-item-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
    margin: 0;
    flex: 1;
    min-width: 0;
}
.docs-item-actions {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}
.docs-item-content {
    color: var(--muted);
    font-size: 0.875rem;
    line-height: 1.5;
    word-wrap: break-word;
}
.docs-item-meta {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--border);
    font-size: 0.75rem;
    color: var(--muted);
}
.docs-type-pill-modern {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    background: rgba(88, 166, 255, 0.15);
    border: 1px solid var(--border);
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--brand);
}
.docs-type-pill-modern i {
    font-size: 0.875rem;
}
.meeting-participants-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    background: rgba(34, 197, 94, 0.15);
    border: 1px solid rgba(34, 197, 94, 0.3);
    border-radius: 6px;
    font-size: 0.75rem;
    color: #86efac;
}
.meeting-link-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    background: rgba(147, 51, 234, 0.15);
    border: 1px solid rgba(147, 51, 234, 0.3);
    border-radius: 6px;
    font-size: 0.75rem;
    color: #c4b5fd;
}
.participant-row {
    transition: background 0.2s ease, border-color 0.2s ease;
}
.participant-row:hover {
    background: var(--panel-2) !important;
    border-color: var(--border) !important;
}
#meetingParticipantsList,
.docs-participants-list {
    min-height: 100px;
    background: var(--panel-2);
    border: 1px solid var(--border);
}
/* Zakładki docs jak WBS: tylko ikonki, tekst po hover/active z animacją (wszystkie viewporty) */
#tab-docs .docs-inner-tabs.nav-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
    margin-left: 0;
}
#tab-docs .docs-inner-tabs.nav-tabs .nav-link:hover .tab-label,
#tab-docs .docs-inner-tabs.nav-tabs .nav-link.active .tab-label,
#tab-docs .docs-inner-tabs.nav-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1;
    margin-left: 0.25rem;
}
/* Przyciski docs jak WBS: tylko ikonki, ten sam rozmiar */
#tab-docs .btn-docs-action .btn-docs-label {
    display: none !important;
}
#tab-docs .btn-docs-action .me-1 {
    margin-right: 0 !important;
}
#tab-docs .docs-section-modern .btn-docs-action,
#tab-docs .docs-section-modern .btn-primary.btn-docs-action,
#tab-docs .docs-section-modern label.btn-docs-action {
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}
#tab-docs .docs-section-modern .btn-docs-action i,
#tab-docs .docs-section-modern .btn-primary.btn-docs-action i {
    color: inherit;
}
body.offer-readonly .docs-item-actions .btn {
    pointer-events: auto !important;
    opacity: 1 !important;
}

/* ========== Moduł Referencje (biblioteka + szczegóły) ========== */
.references-view .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}

/* Referencje w sekcji Firma – content w tej samej szerokości co tytuł (bez dodatkowego px paddingu) */
.company-references-view #referencesListWrapper {
    padding-left: 0;
    padding-right: 0;
}
.company-references-view #referencesListWrapper .row {
    margin-left: 0;
    margin-right: 0;
}
.company-references-view #referencesListWrapper .row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

/* Referencje w Firma: usuń etykietę „Referencje” z paska wyszukiwania, wyszukiwarka na pełną szerokość */
.company-references-view .main-top > .d-flex:first-child {
    display: none;
}
.company-references-view .main-top .d-flex:last-child {
    flex-grow: 1;
    min-width: 0;
}
.company-references-view .main-top #refsSearch {
    width: 100%;
    max-width: none;
}

/* Referencje w ofercie – box szary (nadpisanie niebieskiego z styles.css), przycisk btn-primary, tylko ikonka */
#tab-references #offerRefsSection,
#tab-references .refs-offer-section.card-surface {
    background: var(--panel) !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-references #offerRefsSection:hover,
#tab-references .refs-offer-section.card-surface:hover {
    border-color: var(--border) !important;
    background: var(--panel) !important;
    box-shadow: var(--shadow);
}
#tab-references .refs-offer-btn-label {
    display: none !important;
}
#tab-references .refs-offer-header .btn-ref-offer-add {
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: #fff !important;
}
#tab-references .refs-offer-header .btn-ref-offer-add:hover {
    background: #8bb0ff !important;
    border-color: #8bb0ff !important;
    color: #fff !important;
}
#tab-references .refs-offer-header .btn-ref-offer-add i {
    color: #fff !important;
}
#tab-references .refs-offer-header .btn-ref-offer-add .ms-1 {
    margin-right: 0 !important;
}

/* ========== Moduł Q&A (Pytania i Odpowiedzi) – szare boxy, spójne z tab-docs/summary ========== */
#tab-qa .qa-module .card-surface {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-qa .qa-module .card-surface:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-qa .qa-title-icon {
    color: var(--brand);
    font-size: 1.1rem;
}
#tab-qa .docs-item-modern {
    background: var(--panel-2);
    border: 1px solid var(--border);
}
#tab-qa .docs-item-modern:hover {
    border-color: var(--brand);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* Q&A: przyciski tylko ikonki (wszystkie viewporty) */
#tab-qa .qa-btn-with-label .qa-btn-label {
    display: none !important;
}
#tab-qa .qa-btn-with-label .me-1 {
    margin-right: 0 !important;
}
#tab-qa .qa-btn-with-label.btn-primary,
#tab-qa .qa-btn-with-label.btn-ghost {
    min-width: 2.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.ref-details-tabs.pretty-tabs.nav-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    overflow: hidden;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
    margin-left: 0;
}
.ref-details-tabs.pretty-tabs.nav-tabs .nav-link:hover .tab-label,
.ref-details-tabs.pretty-tabs.nav-tabs .nav-link.active .tab-label,
.ref-details-tabs.pretty-tabs.nav-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1;
    margin-left: 0.25rem;
}

/* ========== Moduł Udostępnianie (offers_share) – szare boxy, zakładki ikonki + animacja tekstu ========== */
#tab-share .card-surface,
#tab-share .docs-section-modern {
    background: var(--panel-2);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
}
#tab-share .card-surface:hover,
#tab-share .docs-section-modern:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}
#tab-share .share-inner-tabs.pretty-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
    margin-left: 0;
}
#tab-share .share-inner-tabs.pretty-tabs .nav-link:hover .tab-label,
#tab-share .share-inner-tabs.pretty-tabs .nav-link.active .tab-label,
#tab-share .share-inner-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1;
    margin-left: 0.25rem;
}

/* Q&A: sub-zakładki (Pytania od Nas / Pytania od Klienta) – spójne z share-inner-tabs */
#tab-qa .qa-inner-tabs.pretty-tabs .nav-link .tab-label {
    display: inline-block !important;
    max-width: 0 !important;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: max-width 0.25s ease, opacity 0.25s ease, margin 0.2s ease;
    margin-left: 0;
}
#tab-qa .qa-inner-tabs.pretty-tabs .nav-link:hover .tab-label,
#tab-qa .qa-inner-tabs.pretty-tabs .nav-link.active .tab-label,
#tab-qa .qa-inner-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 180px !important;
    opacity: 1;
    margin-left: 0.25rem;
}

/* ========== Mobile: ukrycie pasków przewijania (zachowanie przewijania dotykiem) ========== */
@media (max-width: 767px) {
    .app-shell,
    #offerTabsWrapper {
        overflow-x: hidden;
    }
    .tab-content,
    .docs-list-modern,
    .modal-dialog-scrollable .modal-body,
    #tab-docs .docs-section-modern,
    #tab-share .card-surface,
    #tab-share .tab-pane,
    #referencesView,
    #refDetailsWrapper,
    #companyNavReferencesView .table-responsive,
    #offerRefsSection,
    .ref-offer-modal-table,
    #tab-qa .qa-module {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    #tab-share .card-surface,
    #tab-share .tab-pane {
        overflow-x: hidden;
    }
    .tab-content::-webkit-scrollbar,
    .docs-list-modern::-webkit-scrollbar,
    .modal-dialog-scrollable .modal-body::-webkit-scrollbar,
    #tab-docs .docs-section-modern::-webkit-scrollbar,
    #tab-share .card-surface::-webkit-scrollbar,
    #tab-share .tab-pane::-webkit-scrollbar,
    #referencesView::-webkit-scrollbar,
    #refDetailsWrapper::-webkit-scrollbar,
    #companyNavReferencesView .table-responsive::-webkit-scrollbar,
    #offerRefsSection::-webkit-scrollbar,
    .ref-offer-modal-table::-webkit-scrollbar,
    #tab-qa .qa-module::-webkit-scrollbar {
        display: none;
    }
    /* Referencje: przyciski tylko ikonki na mobile */
    .btn-ref-add .btn-ref-label,
    .btn-ref-back .btn-ref-back-label {
        display: none !important;
    }
    .btn-ref-add .me-1,
    .btn-ref-back .me-1 {
        margin-right: 0 !important;
    }
    .btn-ref-add,
    .btn-ref-back {
        min-width: 2.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

/* ========== CRM Leady ========== */
.crm-leads {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.leads-view-tabs .nav-link,
.leads-type-tabs .nav-link {
    display: inline-flex;
    align-items: center;
}
.leads-view-tabs .leads-tab-label,
.leads-type-tabs .leads-tab-label {
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    white-space: nowrap;
    transition: width 0.2s ease, opacity 0.2s ease;
    margin-left: 0;
}
.leads-view-tabs .nav-link.active .leads-tab-label,
.leads-view-tabs .nav-link:hover .leads-tab-label,
.leads-type-tabs .nav-link.active .leads-tab-label,
.leads-type-tabs .nav-link:hover .leads-tab-label {
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}

@media (max-width: 991px) {
    .crm-leads .leads-content-box .table-responsive,
    .crm-leads .leads-content-box .kanban-container {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .crm-leads .leads-content-box .table-responsive::-webkit-scrollbar,
    .crm-leads .leads-content-box .kanban-container::-webkit-scrollbar {
        display: none;
    }
}

.kanban-container {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    min-height: 600px;
    overscroll-behavior-x: contain;
    width: 100%;
    max-width: 100%;
    padding: 0.5rem;
}
.kanban-column {
    min-width: 280px;
    max-width: 280px;
    background: var(--panel-2);
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.kanban-column-header {
    font-weight: 600;
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.kanban-column-count { background: var(--panel); padding: 0.25rem 0.5rem; border-radius: 12px; font-size: 0.75rem; }
.kanban-column-body { flex: 1; min-height: 200px; display: flex; flex-direction: column; gap: 0.75rem; }
.kanban-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 0.75rem;
    cursor: move;
    transition: all 0.2s ease;
}
.kanban-card:hover { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); transform: translateY(-2px); }
.kanban-card.dragging { opacity: 0.5; }
.kanban-card-title { font-weight: 600; font-size: 0.9rem; margin-bottom: 0.5rem; color: var(--text); }
.kanban-card-info { font-size: 0.75rem; color: var(--text-muted); margin-bottom: 0.25rem; }
.kanban-card-probability { display: inline-block; padding: 0.125rem 0.375rem; border-radius: 4px; font-size: 0.7rem; font-weight: 600; margin-top: 0.5rem; }
.kanban-column.drag-over { background: rgba(122, 162, 255, 0.1); border: 2px dashed rgba(122, 162, 255, 0.5); }

.calendar-container { background: var(--panel-2); border-radius: 8px; padding: 1rem; }
.calendar-header { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.5rem; margin-bottom: 0.5rem; }
.calendar-day-header { text-align: center; font-weight: 600; font-size: 0.85rem; padding: 0.5rem; color: var(--text-muted); }
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.5rem; }
.calendar-day { min-height: 120px; background: var(--panel); border: 1px solid var(--border); border-radius: 6px; padding: 0.5rem; position: relative; }
.calendar-day.other-month { opacity: 0.3; }
.calendar-day.today { border: 2px solid var(--brand); background: rgba(122, 162, 255, 0.05); }
.calendar-day-number { font-weight: 600; font-size: 0.9rem; margin-bottom: 0.5rem; color: var(--text); }
.calendar-lead-item { background: var(--panel-2); border-left: 3px solid var(--brand); border-radius: 4px; padding: 0.375rem; margin-bottom: 0.25rem; font-size: 0.75rem; cursor: pointer; transition: all 0.2s ease; }
.calendar-lead-item:hover { background: rgba(122, 162, 255, 0.1); transform: translateX(2px); }
.calendar-lead-title { font-weight: 600; color: var(--text); margin-bottom: 0.125rem; }
.calendar-lead-info { color: var(--text-muted); font-size: 0.7rem; }

.lead-notes-list { max-height: 500px; overflow-y: auto; }
/* Notatki i historia – czytelny tekst w ciemnym motywie (tytuły i treść) */
.lead-notes-list .card-surface,
.lead-notes-list .card-surface h6,
.lead-notes-list .card-surface .lead-note-content,
#leadDetailsHistory,
#leadViewHistory {
    color: var(--text);
}
#leadDetailsHistory strong,
#leadViewHistory strong {
    color: var(--text);
}
.lead-note-content { color: var(--text); line-height: 1.6; }
.lead-note-content p { margin-bottom: 0.5rem; }
.lead-note-content ul, .lead-note-content ol { margin-left: 1.5rem; margin-bottom: 0.5rem; }
.lead-note-content a { color: var(--brand); text-decoration: none; }
.lead-note-content a:hover { text-decoration: underline; }

/* ========== Panel Pracownika (Bootstrap 5) – styl jak CRM ========== */
.employee-panel-container { margin: 0; padding: 0; }
.employee-panel-nav-container { gap: 0; min-height: calc(100vh - 64px); }
.employee-panel-sidebar {
    width: 280px;
    flex-shrink: 0;
    background: var(--sidebar-bg);
    box-shadow: var(--shadow);
    border-right: 1px solid var(--border);
    position: fixed;
    top: 64px;
    left: 0;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 100;
    overflow: visible;
    transition: width 0.2s ease, transform 0.25s ease;
}
.employee-panel-sidebar .sidebar-scroll {
    flex: 1;
    min-height: 0;
    overflow-x: visible;
}
.employee-panel-sidebar .list-group { overflow: visible; border: none; margin: 0; }
.employee-panel-sidebar .employee-panel-nav-item {
    display: flex;
    align-items: center;
    color: var(--sidebar-item-text);
    text-decoration: none;
    transition: all 0.2s ease;
}
.employee-panel-sidebar .employee-panel-nav-item .tab-label {
    display: inline-block;
    width: auto;
    opacity: 1;
    margin-left: 0.35rem;
}
.employee-panel-nav-inner .list-group {
    margin: 0;
}
.employee-panel-sidebar .employee-panel-nav-item:hover,
.employee-panel-sidebar .employee-panel-nav-item.active { color: #f3f4f6; }
.employee-panel-sidebar .employee-panel-nav-item.active { color: var(--sidebar-item-text); }

.employee-panel-content {
    margin-left: 280px;
    width: calc(100% - 280px);
    overflow-x: hidden;
    min-height: calc(100vh - 64px);
    color: var(--text);
}
.employee-panel-content .form-label,
.employee-panel-content .small,
.employee-panel-content .card-body .small,
.employee-panel-content .card-body .h4,
.employee-panel-content .h4 {
    color: var(--text) !important;
}
.employee-panel-content .text-muted {
    color: rgba(255, 255, 255, 0.65) !important;
}
.employee-panel-content .table th,
.employee-panel-content .table td {
    color: var(--text);
}

.employee-panel-section-box { }
.employee-panel-section-title { color: var(--text) !important; font-weight: 600; }
.employee-panel-section-box .reports-section-box { background: var(--panel-2); border: 1px solid var(--border); border-radius: var(--radius); }
.employee-panel-section-box .reports-section-box .card-header { background: rgba(255, 255, 255, 0.04); border-bottom: 1px solid var(--border); color: var(--text); }
.employee-panel-section-box .form-label { color: var(--text); }
/* Nieobecności – etykieta miesiąca i pola filtrów zawsze czytelne (kontrast na ciemnym tle) */
.employee-panel-section-box .employee-panel-absences-month-label,
.employee-panel-section-box #employeePanelAbsencesMonthLabel {
    color: var(--text) !important;
    min-width: 1ch;
}
.employee-panel-section-box .reports-section-box .card-body .form-select,
.employee-panel-section-box .reports-section-box .card-body .form-control {
    color: var(--text);
    background-color: var(--panel);
}
.employee-panel-data-label { color: rgba(255, 255, 255, 0.6); }
.employee-panel-data-value { color: var(--text); }

.employee-panel-settlement-table-header { color: var(--text) !important; font-weight: 600; }
.employee-panel-doc-preview-frame-wrap { position: relative; width: 100%; min-height: 600px; }
.employee-panel-doc-preview-frame { width: 100%; height: 600px; min-height: 600px; border: 1px solid var(--border); border-radius: var(--radius); }

.employee-panel-absences-tabs.pretty-tabs .nav-link { display: inline-flex; align-items: center; }
.employee-panel-absences-tabs.pretty-tabs .nav-link .tab-label {
    display: inline-block;
    white-space: nowrap;
    max-width: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-width 0.25s ease, opacity 0.2s ease;
    margin-left: 0;
}
.employee-panel-absences-tabs.pretty-tabs .nav-link:hover .tab-label,
.employee-panel-absences-tabs.pretty-tabs .nav-link.active .tab-label,
.employee-panel-absences-tabs.pretty-tabs .nav-link:focus-visible .tab-label {
    max-width: 10em;
    opacity: 1;
    margin-left: 0.35rem;
}

@media (max-width: 991.98px) {
    .employee-panel-sidebar {
        position: fixed;
        left: 0;
        top: 64px;
        width: 280px;
        max-width: 85vw;
        height: calc(100vh - 64px);
        transform: translateX(-100%);
        z-index: 1040;
        box-shadow: var(--shadow);
        border-right: 1px solid var(--border);
        transition: transform 0.2s ease;
        padding: 0.25rem 0;
    }
    .employee-panel-nav-container:not(.employee-panel-sidebar-collapsed) .employee-panel-sidebar {
        transform: translateX(0);
    }
    .employee-panel-nav-container:not(.employee-panel-sidebar-collapsed) .employee-panel-nav-backdrop {
        display: block;
    }
    .employee-panel-sidebar .nav-section-header {
        padding: 0.5rem 0.5rem 0.5rem 2.5rem;
        text-align: left;
        font-size: 0.75rem;
    }
    .employee-panel-sidebar .employee-panel-nav-item {
        justify-content: flex-start;
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
    .employee-panel-sidebar .employee-panel-nav-item .tab-label {
        display: inline-block;
        max-width: 12em;
        opacity: 1;
        margin-left: 0.5rem;
    }
    .employee-panel-content {
        margin-left: 0;
        width: 100%;
    }
    .employee-panel-section-box .table-responsive { margin-left: -0.5rem; margin-right: -0.5rem; }
    .employee-panel-section-box .table-responsive table { min-width: 520px; }
}
.employee-panel-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    top: 64px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1035;
    transition: opacity 0.2s ease;
}
@media (max-width: 575.98px) {
    .employee-panel-sidebar { width: 260px; }
}