.root { }
body, html {height: 100%;}
.app-container {display:flex;flex-direction:column;min-height:100vh;}
.app-main {display:flex;flex:1;}
.app-sidebar {width:220px;background:var(--sidebar-bg);color:var(--sidebar-color);transition:width 0.3s;}
.app-sidebar.collapsed {width:60px;}
.app-sidebar .nav-link {color:var(--sidebar-color);display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:0.9rem;white-space:nowrap;}
.app-sidebar .nav-link:hover,.app-sidebar .nav-link.active {background:var(--sidebar-active-bg);color:#fff;}
.app-sidebar.collapsed .nav-link span {display:none;}
.app-content {flex:1;padding:1rem;background-color:var(--content-bg);color:var(--text-color);}
.navbar-brand {font-weight:600; color:var(--header-color) !important;}
.navbar-brand:hover, .navbar-brand:focus {color:var(--header-color) !important;}
.app-header .navbar {background-color:var(--header-bg) !important; color:var(--header-color);}
.app-header .btn {margin-left:0 !important;}

body {
    background-color: var(--bg);
    color: var(--text-color);
    /* Ensure Bootstrap components use theme colors */
    --bs-body-bg: var(--bg);
    --bs-body-color: var(--text-color);
}

/* Buttons */
.btn-outline-secondary {
    border-color: var(--sidebar-active-bg) !important;
    color: var(--text-color) !important;
}

/* Form controls inherit theme colors */
.form-control, .form-select, textarea {
    background-color: var(--content-bg);
    color: var(--text-color);
    border-color: var(--sidebar-active-bg);
}
.form-label, label {
    color: var(--text-color);
}

/* Labels inside card headers should match header text color */
.card-header label {
    color: inherit;
}
.form-control:focus, .form-select:focus, textarea:focus {
    background-color: var(--content-bg);
    color: var(--text-color);
}
.form-control::placeholder {
    color: var(--text-color);
    opacity: 0.7;
}

/* Tables - POPRAWIONE */
.table {
    background-color: var(--table-bg);
    color: var(--text-color) !important;
    border-color: var(--table-border);
}
.table tbody tr {
    background-color: var(--table-bg);
    color: var(--text-color) !important;
}
.table tbody td {
    background-color: var(--table-bg);
    color: var(--text-color) !important;
}
.table tbody tr:hover, .table tbody td:hover {
    background-color: var(--content-bg);
    color: var(--text-color) !important;
}

.table th,
.table td {
    border-color: var(--table-border);
    color: var(--text-color) !important;
}

/* Nagłówki tabeli */
.table thead th {
    background-color: var(--content-bg);
    color: var(--text-color) !important;
    border-color: var(--table-border);
}

/* Formularze w tabeli */
.table input[type="checkbox"] {
    accent-color: var(--sidebar-active-bg);
}

/* Modern style for status filter checkboxes */
.status-checkbox {
    appearance: none;
    width: 16px;
    height: 16px;
    border: 2px solid var(--sidebar-active-bg);
    border-radius: 4px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    margin-right: 4px;
    background-color: var(--content-bg);
}

.status-checkbox:checked {
    background-color: var(--sidebar-active-bg);
}

.status-checkbox:checked::after {
    content: "\2713";
    position: absolute;
    color: #fff;
    font-size: 12px;
    top: -1px;
    left: 2px;
}

/* Przyciski w tabeli */
.table .btn {
    color: var(--text-color) !important;
    border-color: var(--table-border);
}

.form-control:disabled, .form-select:disabled, textarea:disabled {
    background-color: var(--disabled-bg);
    color: var(--sidebar-color);
    opacity: 0.7;
}

/* Theme definitions */
/* JASNE MOTYWY - Poprawione kontrast i harmonia kolorów */

/* Light 1 - Classic Clean */
body[data-theme="light1"] {
  --bg: #f8fafc;
  --content-bg: #ffffff;
  --text-color: #1e293b;
  --sidebar-bg: #334155;
  --sidebar-color: #f1f5f9;
  --sidebar-active-bg: #475569;
  --header-bg: #ffffff;
  --header-color: #1e293b;
  --table-bg: #ffffff;
  --table-border: #e2e8f0;
  --disabled-bg: #f1f5f9;
}

/* Light 2 - Warm Minimal */
body[data-theme="light2"] {
  --bg: #fefcfb;
  --content-bg: #ffffff;
  --text-color: #44403c;
  --sidebar-bg: #78716c;
  --sidebar-color: #fafaf9;
  --sidebar-active-bg: #57534e;
  --header-bg: #ffffff;
  --header-color: #44403c;
  --table-bg: #ffffff;
  --table-border: #e7e5e4;
  --disabled-bg: #f5f5f4;
}

/* Light 3 - Blue Professional */
body[data-theme="light3"] {
  --bg: #f0f9ff;
  --content-bg: #ffffff;
  --text-color: #0f172a;
  --sidebar-bg: #0ea5e9;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #0284c7;
  --header-bg: #ffffff;
  --header-color: #0f172a;
  --table-bg: #ffffff;
  --table-border: #bae6fd;
  --disabled-bg: #e0f2fe;
}

/* Light 4 - Green Fresh */
body[data-theme="light4"] {
  --bg: #f0fdf4;
  --content-bg: #ffffff;
  --text-color: #14532d;
  --sidebar-bg: #16a34a;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #15803d;
  --header-bg: #ffffff;
  --header-color: #14532d;
  --table-bg: #ffffff;
  --table-border: #bbf7d0;
  --disabled-bg: #dcfce7;
}

/* Light 5 - Purple Modern */
body[data-theme="light5"] {
  --bg: #faf5ff;
  --content-bg: #ffffff;
  --text-color: #581c87;
  --sidebar-bg: #9333ea;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #7c3aed;
  --header-bg: #ffffff;
  --header-color: #581c87;
  --table-bg: #ffffff;
  --table-border: #d8b4fe;
  --disabled-bg: #f3e8ff;
}

/* Light 6 - Orange Energetic */
body[data-theme="light6"] {
  --bg: #fff7ed;
  --content-bg: #ffffff;
  --text-color: #9a3412;
  --sidebar-bg: #ea580c;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #dc2626;
  --header-bg: #ffffff;
  --header-color: #9a3412;
  --table-bg: #ffffff;
  --table-border: #fed7aa;
  --disabled-bg: #ffedd5;
}

/* CIEMNE MOTYWY - Inspirowane załączonymi screenami */

/* Dark 1 - Deep Blue Dashboard (jak screen 3) */
body[data-theme="dark1"] {
  --bg: #0f172a;
  --content-bg: #1e293b;
  --text-color: #f1f5f9;
  --sidebar-bg: #334155;
  --sidebar-color: #cbd5e1;
  --sidebar-active-bg: #475569;
  --header-bg: #1e293b;
  --header-color: #f1f5f9;
  --table-bg: #1e293b;
  --table-border: #475569;
  --disabled-bg: #334155;
}

/* Dark 2 - Charcoal Professional (jak screen 4) */
body[data-theme="dark2"] {
  --bg: #111827;
  --content-bg: #1f2937;
  --text-color: #f9fafb;
  --sidebar-bg: #374151;
  --sidebar-color: #e5e7eb;
  --sidebar-active-bg: #4b5563;
  --header-bg: #1f2937;
  --header-color: #f9fafb;
  --table-bg: #1f2937;
  --table-border: #4b5563;
  --disabled-bg: #374151;
}

/* Dark 3 - Midnight Black */
body[data-theme="dark3"] {
  --bg: #000000;
  --content-bg: #0a0a0a;
  --text-color: #ffffff;
  --sidebar-bg: #1a1a1a;
  --sidebar-color: #e5e5e5;
  --sidebar-active-bg: #2a2a2a;
  --header-bg: #0a0a0a;
  --header-color: #ffffff;
  --table-bg: #0a0a0a;
  --table-border: #333333;
  --disabled-bg: #1a1a1a;
}

/* Dark 4 - GitHub Dark */
body[data-theme="dark4"] {
  --bg: #0d1117;
  --content-bg: #161b22;
  --text-color: #f0f6fc;
  --sidebar-bg: #21262d;
  --sidebar-color: #e6edf3;
  --sidebar-active-bg: #30363d;
  --header-bg: #161b22;
  --header-color: #f0f6fc;
  --table-bg: #161b22;
  --table-border: #30363d;
  --disabled-bg: #21262d;
}

/* Dark 5 - Purple Night */
body[data-theme="dark5"] {
  --bg: #1a0f2e;
  --content-bg: #2d1b47;
  --text-color: #e9d5ff;
  --sidebar-bg: #3730a3;
  --sidebar-color: #e9d5ff;
  --sidebar-active-bg: #4c1d95;
  --header-bg: #2d1b47;
  --header-color: #e9d5ff;
  --table-bg: #2d1b47;
  --table-border: #4c1d95;
  --disabled-bg: #3730a3;
}

/* TRENDOWE MOTYWY - Z coolors.co */

/* Trend 1 - Sunset Gradient */
body[data-theme="trend1"] {
  --bg: #264653;
  --content-bg: #2a9d8f;
  --text-color: #ffffff;
  --sidebar-bg: #e76f51;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #f4a261;
  --header-bg: #2a9d8f;
  --header-color: #ffffff;
  --table-bg: #2a9d8f;
  --table-border: #e9c46a;
  --disabled-bg: #264653;
}

/* Trend 2 - Ocean Breeze */
body[data-theme="trend2"] {
  --bg: #f7fff7;
  --content-bg: #ffffff;
  --text-color: #1b4332;
  --sidebar-bg: #2d6a4f;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #40916c;
  --header-bg: #ffffff;
  --header-color: #1b4332;
  --table-bg: #ffffff;
  --table-border: #74c69d;
  --disabled-bg: #d8f3dc;
}

/* Trend 3 - Coral Reef */
body[data-theme="trend3"] {
  --bg: #fff0f3;
  --content-bg: #ffffff;
  --text-color: #7209b7;
  --sidebar-bg: #f72585;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #b5179e;
  --header-bg: #ffffff;
  --header-color: #7209b7;
  --table-bg: #ffffff;
  --table-border: #f72585;
  --disabled-bg: #ffc2d1;
}

/* Trend 4 - Golden Hour */
body[data-theme="trend4"] {
  --bg: #fff8e1;
  --content-bg: #ffffff;
  --text-color: #bf360c;
  --sidebar-bg: #ff6f00;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #e65100;
  --header-bg: #ffffff;
  --header-color: #bf360c;
  --table-bg: #ffffff;
  --table-border: #ffb74d;
  --disabled-bg: #ffe0b2;
}

/* Trend 5 - Arctic Blue */
body[data-theme="trend5"] {
  --bg: #e3f2fd;
  --content-bg: #ffffff;
  --text-color: #0d47a1;
  --sidebar-bg: #1976d2;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #1565c0;
  --header-bg: #ffffff;
  --header-color: #0d47a1;
  --table-bg: #ffffff;
  --table-border: #90caf9;
  --disabled-bg: #bbdefb;
}

/* Trend 6 - Forest Dark */
body[data-theme="trend6"] {
  --bg: #1b5e20;
  --content-bg: #2e7d32;
  --text-color: #e8f5e8;
  --sidebar-bg: #388e3c;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #43a047;
  --header-bg: #2e7d32;
  --header-color: #ffffff;
  --table-bg: #2e7d32;
  --table-border: #66bb6a;
  --disabled-bg: #1b5e20;
}

/* Custom Layout - ECEBDF */
body[data-theme="layout1"] {
  --bg: #ECEBDF;
  --content-bg: #ffffff;
  --text-color: #323130;
  --sidebar-bg: #125B8B;
  --sidebar-color: #ffffff;
  --sidebar-active-bg: #D36A09;
  --header-bg: #ffffff;
  --header-color: #125B8B;
  --table-bg: #ffffff;
  --table-border: #D36A09;
  --disabled-bg: #e3e2d5;
}
.recent-card {
  background-color: #d1fae5 !important;
}
.recent-card td {
  background-color: #d1fae5 !important;
}
.mod-0-15 {
  background-color: #bbf7d0 !important;
}
.mod-0-15 td {
  background-color: #bbf7d0 !important;
}
.mod-15-30 {
  background-color: #d1fae5 !important;
}
.mod-15-30 td {
  background-color: #d1fae5 !important;
}
.mod-30-60 {
  background-color: #ecfdf5 !important;
}
.mod-30-60 td {
  background-color: #ecfdf5 !important;
}