:root {
    /* Jasny motyw (Warm Light Theme) */
    --theme-bg: #f5f2eb;
    --theme-surface: #ffffff;
    --theme-surface-muted: #eee9de;
    --theme-text: #221e18;
    --theme-text-muted: #786c5e;
    --theme-accent: #9c764a;
    --theme-accent-muted: #f0e6d8;
    --theme-border: #e2d9cc;
    --theme-danger: #dc2626;
    --theme-warning: #d97706;
    --theme-success: #16a34a;
    --theme-info: #2563eb;
    --theme-charity: #db2777;
    --theme-overlay: rgba(34, 30, 24, 0.35);
}

[data-theme="dark"] {
    /* Ciemny motyw (Warm Dark Palette - dopasowany do aplikacji mobilnej) */
    --theme-bg: #161310;
    --theme-surface: #221e18;
    --theme-surface-muted: #2e2821;
    --theme-text: #f5f0e6;
    --theme-text-muted: #aa9d8d;
    --theme-accent: #cca476;
    --theme-accent-muted: #3b3228;
    --theme-border: #3a3128;
    --theme-danger: #ef4444;
    --theme-warning: #f59e0b;
    --theme-success: #10b981;
    --theme-info: #3b82f6;
    --theme-charity: #ec4899;
    --theme-overlay: rgba(0, 0, 0, 0.65);
}

body.theme-app {
    background-color: var(--theme-bg);
    color: var(--theme-text);
}

/* Nadpisanie standardowych klas Bootstrap dla spójności w ciemnym/jasnym motywie */
.theme-app .bg-light,
.theme-app .bg-white {
    background-color: var(--theme-surface) !important;
}

.theme-app .text-dark,
[data-theme="dark"] .theme-app .text-dark,
[data-theme="dark"] .text-dark {
    color: var(--theme-text) !important;
}

.theme-app .text-secondary,
.theme-app .text-muted,
[data-theme="dark"] .theme-app .text-secondary,
[data-theme="dark"] .theme-app .text-muted {
    color: var(--theme-text-muted) !important;
}

.theme-app .text-primary,
[data-theme="dark"] .theme-app .text-primary {
    color: var(--theme-accent) !important;
}

.theme-app .border,
.theme-app .border-bottom,
.theme-app .border-top,
.theme-app .border-light {
    border-color: var(--theme-border) !important;
}

/* Przyciski w stylu aplikacji mobilnej */
.theme-app .btn-primary {
    background-color: var(--theme-accent);
    border-color: var(--theme-accent);
    color: #181512;
    font-weight: 600;
    border-radius: 12px;
}
.theme-app .btn-primary:hover,
.theme-app .btn-primary:focus,
.theme-app .btn-primary:active {
    background-color: var(--theme-accent);
    border-color: var(--theme-accent);
    color: #181512;
    opacity: 0.9;
}

.theme-app .btn-outline-primary {
    color: var(--theme-accent);
    border-color: var(--theme-border);
    background-color: var(--theme-surface-muted);
    border-radius: 12px;
    font-weight: 500;
}
.theme-app .btn-outline-primary:hover,
.theme-app .btn-check:checked + .btn-outline-primary,
.theme-app .btn-outline-primary.active {
    background-color: var(--theme-accent) !important;
    border-color: var(--theme-accent) !important;
    color: #181512 !important;
    font-weight: 600;
}

.theme-app .btn-light,
.theme-app .btn-outline-secondary {
    background-color: var(--theme-surface-muted);
    border-color: var(--theme-border);
    color: var(--theme-text);
    border-radius: 12px;
}
.theme-app .btn-light:hover,
.theme-app .btn-outline-secondary:hover {
    background-color: var(--theme-border);
    color: var(--theme-text);
}

/* Formularze i Karty (Mobilne zaokrąglenia i kolory) */
.theme-app .form-card,
.theme-app .card {
    background-color: var(--theme-surface) !important;
    border-color: var(--theme-border) !important;
    color: var(--theme-text) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 16px var(--theme-overlay) !important;
}

.theme-app .form-label {
    color: var(--theme-text) !important;
    font-weight: 600;
    margin-bottom: 6px;
}

.theme-app .form-control,
.theme-app .form-select {
    background-color: var(--theme-surface-muted) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
    border-radius: 12px !important;
    padding: 10px 14px;
}

.theme-app .form-control:focus,
.theme-app .form-select:focus {
    border-color: var(--theme-accent) !important;
    box-shadow: 0 0 0 3px var(--theme-accent-muted) !important;
    background-color: var(--theme-surface-muted) !important;
    color: var(--theme-text) !important;
}

.theme-app .form-control::placeholder {
    color: var(--theme-text-muted) !important;
    opacity: 0.7;
}

/* Modale i Offcanvas */
.theme-app .modal-content {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
    border-radius: 20px !important;
}

.theme-app .offcanvas,
.theme-app .offcanvas-bottom {
    background-color: var(--theme-bg) !important;
    color: var(--theme-text) !important;
    border-top: 1px solid var(--theme-border) !important;
}

.theme-app .offcanvas-header {
    border-bottom: 1px solid var(--theme-border) !important;
}

[data-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* Nagłówek górny aplikacji */
.theme-app .app-header,
.app-header {
    background: var(--theme-surface) !important;
    border-bottom: 1px solid var(--theme-border) !important;
    padding: 12px 16px !important;
    min-height: 54px;
}
.theme-app .app-header h1,
.theme-app .app-brand,
.app-header h1,
.app-header .app-brand {
    color: var(--theme-text) !important;
    font-weight: 700;
    font-size: 1.15rem;
}
.app-header a,
.app-header button {
    color: var(--theme-text) !important;
}
.app-header a:hover,
.app-header button:hover {
    opacity: 0.85;
}

/* Dolna nawigacja mobilna */
.theme-app .app-bottom-nav {
    background: var(--theme-surface) !important;
    border-top: 1px solid var(--theme-border) !important;
}
.theme-app .app-nav-item {
    color: var(--theme-text-muted) !important;
}
.theme-app .app-nav-item.active {
    color: var(--theme-accent) !important;
}

/* Accordion */
.theme-app .accordion-button {
    background-color: var(--theme-surface-muted) !important;
    color: var(--theme-text) !important;
}
.theme-app .accordion-button:not(.collapsed) {
    background-color: var(--theme-accent-muted) !important;
    color: var(--theme-accent) !important;
}
.theme-app .accordion-body {
    background-color: var(--theme-surface) !important;
}

/* Przewijany kontener i zakładek pills */
.app-scroll-container {
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: var(--theme-bg);
}

.app-nav-pills {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 0.5rem;
    padding: 10px 16px;
    scrollbar-width: none;
}
.app-nav-pills::-webkit-scrollbar {
    display: none;
}
.app-nav-pills .btn {
    white-space: nowrap;
    border-radius: 20px;
    padding: 6px 16px;
    font-weight: 600;
    font-size: 0.9rem;
}