body {
    background: #f5f7fb;
}

.login-body {
    background:
        radial-gradient(circle at top left, rgba(13, 110, 253, 0.15), transparent 30%),
        #f5f7fb;
}

.oc-page {
    max-width: 1200px;
    margin: 0 auto;
}

.oc-dashboard-card {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.oc-dashboard-card:hover {
    transform: translateY(-2px);
}

.oc-card-number {
    min-width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #eef4ff;
    color: #0d6efd;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.3rem;
}

@media (max-width: 576px) {
    main.container-fluid {
        padding-left: 14px;
        padding-right: 14px;
    }
}
.oc-status-badge {
    background: #eef4ff;
    color: #0d6efd;
    border: 1px solid #d8e6ff;
}

.table > :not(caption) > * > * {
    padding: 1rem;
}

.oc-status-select {
    min-width: 190px;
}
/* Orders page - side filter panel */

.orders-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    margin-top: 24px;
}

.orders-filter-panel {
    position: sticky;
    top: 96px;
    z-index: 2;
}

.orders-filter-card {
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 24px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
    padding: 20px;
}

.orders-filter-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.orders-filter-eyebrow {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 4px;
}

.orders-filter-header h2 {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
}

.orders-filter-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    color: #475569;
    background: #f8fafc;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.orders-filter-clear:hover {
    color: #0f172a;
    background: #eef2ff;
    border-color: #93c5fd;
}

.orders-filter-section {
    margin-bottom: 14px;
}

.orders-filter-section:last-child {
    margin-bottom: 0;
}

.orders-filter-label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #475569;
    margin-bottom: 6px;
}

.orders-filter-card .form-control,
.orders-filter-card .form-select {
    min-height: 42px;
    border-radius: 14px;
    border-color: #dbe3ef;
    font-size: 14px;
}

.orders-filter-card .form-control:focus,
.orders-filter-card .form-select:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.orders-search-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.orders-search-row .btn {
    border-radius: 14px;
    font-weight: 800;
}

.orders-results-panel {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .orders-layout {
        grid-template-columns: 1fr;
    }

    .orders-filter-panel {
        position: static;
    }

    .orders-filter-card {
        border-radius: 20px;
    }
}


/* Orders page - side filter panel */

.orders-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    margin-top: 24px;
}

.orders-filter-panel {
    position: sticky;
    top: 96px;
    z-index: 2;
}

.orders-filter-card {
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 24px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
    padding: 20px;
}

.orders-filter-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.orders-filter-eyebrow {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 4px;
}

.orders-filter-header h2 {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
}

.orders-filter-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    color: #475569;
    background: #f8fafc;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.orders-filter-clear:hover {
    color: #0f172a;
    background: #eef2ff;
    border-color: #93c5fd;
}

.orders-filter-section {
    margin-bottom: 14px;
}

.orders-filter-section:last-child {
    margin-bottom: 0;
}

.orders-filter-label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #475569;
    margin-bottom: 6px;
}

.orders-filter-card .form-control,
.orders-filter-card .form-select {
    min-height: 42px;
    border-radius: 14px;
    border-color: #dbe3ef;
    font-size: 14px;
}

.orders-filter-card .form-control:focus,
.orders-filter-card .form-select:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.orders-search-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.orders-search-row .btn {
    border-radius: 14px;
    font-weight: 800;
}

.orders-results-panel {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .orders-layout {
        grid-template-columns: 1fr;
    }

    .orders-filter-panel {
        position: static;
    }

    .orders-filter-card {
        border-radius: 20px;
    }
}


/* Orders page - side filter panel */

.orders-layout {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    margin-top: 24px;
}

.orders-filter-panel {
    position: sticky;
    top: 96px;
    z-index: 2;
}

.orders-filter-card {
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 24px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    padding: 20px;
}

.orders-filter-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.orders-filter-eyebrow {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 4px;
}

.orders-filter-header h2 {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 800;
    margin: 0;
    color: #0f172a;
}

.orders-filter-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    color: #475569;
    background: #f8fafc;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.orders-filter-clear:hover {
    color: #0f172a;
    background: #eef2ff;
    border-color: #93c5fd;
}

.orders-filter-section {
    margin-bottom: 14px;
}

.orders-filter-section:last-child {
    margin-bottom: 0;
}

.orders-filter-label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #475569;
    margin-bottom: 6px;
}

.orders-filter-card .form-control,
.orders-filter-card .form-select {
    min-height: 42px;
    border-radius: 14px;
    border-color: #dbe3ef;
    font-size: 14px;
}

.orders-filter-card .form-control:focus,
.orders-filter-card .form-select:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.orders-search-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.orders-search-row .btn {
    border-radius: 14px;
    font-weight: 800;
}

.orders-results-panel {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .orders-layout {
        grid-template-columns: 1fr;
    }

    .orders-filter-panel {
        position: static;
    }

    .orders-filter-card {
        border-radius: 20px;
    }
}



/* Mobile filters compact mode */

@media (max-width: 991.98px) {
    .orders-filter-card {
        padding: 16px;
    }

    .orders-filter-header {
        margin-bottom: 12px;
        padding-bottom: 12px;
    }

    .orders-filter-header h2 {
        font-size: 20px;
    }

    .orders-filter-eyebrow {
        font-size: 10px;
    }

    .orders-filter-section {
        margin-bottom: 10px;
    }

    .orders-filter-card .form-control,
    .orders-filter-card .form-select {
        min-height: 44px;
        font-size: 15px;
    }

    .orders-search-row {
        grid-template-columns: 1fr auto;
        align-items: center;
    }

    .orders-search-row .btn {
        min-height: 44px;
        padding-left: 16px;
        padding-right: 16px;
    }
}


/* Mobile order cards */

@media (max-width: 767.98px) {
    .oc-page {
        padding-left: 12px;
        padding-right: 12px;
    }

    .card.rounded-4 {
        border-radius: 18px !important;
    }

    .card-body {
        padding: 16px;
    }

    .badge {
        white-space: normal;
        text-align: left;
    }

    .orders-results-panel .card {
        margin-bottom: 12px;
    }

    .orders-results-panel .fw-bold,
    .orders-results-panel .fw-semibold {
        word-break: break-word;
    }

    .orders-results-panel .btn {
        min-height: 42px;
    }
}


/* Mobile top navigation improvements */

@media (max-width: 991.98px) {
    .navbar {
        position: sticky;
        top: 0;
        z-index: 1040;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    }

    .navbar-toggler {
        border-radius: 14px;
        padding: 8px 10px;
        border-color: rgba(148, 163, 184, 0.35);
    }

    .navbar-toggler:focus {
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16);
    }

    .navbar-collapse {
        margin-top: 12px;
        padding: 12px;
        border-radius: 18px;
        background: #ffffff;
        border: 1px solid rgba(148, 163, 184, 0.22);
        box-shadow: 0 16px 34px rgba(15, 23, 42, 0.12);
    }

    .navbar-nav {
        gap: 6px;
    }

    .navbar-nav .nav-link {
        border-radius: 14px;
        padding: 11px 13px;
        font-weight: 800;
        color: #475569;
    }

    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus,
    .navbar-nav .nav-link.active {
        background: #eef2ff;
        color: #0f172a;
    }

    .navbar .dropdown-menu {
        border-radius: 16px;
        border-color: rgba(148, 163, 184, 0.22);
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.10);
    }

    .navbar .dropdown-item {
        border-radius: 12px;
        padding: 10px 12px;
        font-weight: 700;
    }
}


/* Shopify thumbnail in order details */

.shopify-product-thumb {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: #f8fafc;
    flex: 0 0 auto;
}

@media (max-width: 575.98px) {
    .shopify-product-thumb {
        width: 58px;
        height: 58px;
        border-radius: 14px;
    }
}


/* Simple order upload */

.order-upload-box {
    min-width: 260px;
}

.order-upload-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.order-attachment-card {
    display: block;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 18px;
    background: #ffffff;
    color: inherit;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.order-attachment-card:hover {
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, 0.45);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.10);
}

.order-attachment-thumb {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
    background: #f8fafc;
}

.order-attachment-file {
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8fafc;
    color: #475569;
    font-weight: 800;
}

.order-attachment-meta {
    padding: 12px 14px;
}

@media (max-width: 767.98px) {
    .order-upload-box {
        min-width: 100%;
    }
}

/* Order labels / multi-status choices */

.order-label-choice-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.order-label-choice {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 13px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.order-label-choice:hover {
    border-color: rgba(37, 99, 235, 0.55);
    background: #f8fafc;
    color: #0f172a;
}

.order-label-choice .order-label-checkbox {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #2563eb;
}

.order-label-choice:has(.order-label-checkbox:checked) {
    background: #eef2ff;
    border-color: rgba(37, 99, 235, 0.75);
    color: #1d4ed8;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.12);
}

/* Order labels display */

.order-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.order-label-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.42);
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.1;
}

.order-label-pill-manual {
    background: #eef2ff;
    border-color: #c7d2fe;
    color: #3730a3;
}

.order-label-pill-shopify_tag {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}

.order-label-pill-shopify_collection {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #c2410c;
}

.order-label-pill-system {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #334155;
}

/* Multiline status badge in order list */

.oc-status-badge-multiline {
    display: inline-flex;
    max-width: 135px;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
    line-height: 1.25;
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Multiline status badge in order detail */

.oc-detail-status-badge-multiline {
    display: inline-flex;
    max-width: 260px;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: left;
    line-height: 1.25;
    padding-top: 5px;
    padding-bottom: 5px;
}


/* =========================================================
   UI CLEANUP LAYER v1
   Kierunek: minimalistyczny SaaS + panel admina
   ========================================================= */

:root {
    --ui-bg: #f6f8fb;
    --ui-surface: #ffffff;
    --ui-surface-muted: #f8fafc;
    --ui-border: #e2e8f0;
    --ui-border-soft: rgba(226, 232, 240, 0.78);
    --ui-text: #0f172a;
    --ui-text-muted: #64748b;
    --ui-text-soft: #94a3b8;
    --ui-primary: #2563eb;
    --ui-primary-hover: #1d4ed8;
    --ui-success: #16a34a;
    --ui-warning: #d97706;
    --ui-danger: #dc2626;
    --ui-radius-sm: 0.75rem;
    --ui-radius: 1rem;
    --ui-radius-lg: 1.25rem;
    --ui-radius-xl: 1.5rem;
    --ui-shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 24px rgba(15, 23, 42, 0.055);
    --ui-shadow-subtle: 0 1px 2px rgba(15, 23, 42, 0.05);
    --ui-focus: 0 0 0 4px rgba(37, 99, 235, 0.14);
}

html {
    min-height: 100%;
    background: var(--ui-bg);
}

body {
    min-height: 100%;
    background: var(--ui-bg) !important;
    color: var(--ui-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

a {
    text-underline-offset: 0.18em;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: none !important;
    box-shadow: var(--ui-focus) !important;
}

/* Uniwersalne komponenty do stopniowego przepinania template'ów */

.ui-page {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 1.25rem;
}

.ui-section {
    margin-top: 1rem;
}

.ui-card {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border-soft);
    border-radius: var(--ui-radius-xl);
    box-shadow: var(--ui-shadow-subtle);
}

.ui-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--ui-border-soft);
    background: var(--ui-surface-muted);
}

.ui-card-body {
    padding: 1.15rem;
}

.ui-title {
    margin: 0;
    color: var(--ui-text);
    font-size: clamp(1.35rem, 2vw, 2rem);
    line-height: 1.12;
    font-weight: 850;
    letter-spacing: -0.035em;
}

.ui-subtitle {
    margin: 0.35rem 0 0;
    color: var(--ui-text-muted);
    font-size: 0.92rem;
    line-height: 1.55;
    font-weight: 600;
}

.ui-eyebrow {
    margin-bottom: 0.35rem;
    color: var(--ui-text-soft);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ui-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.ui-btn,
.btn {
    min-height: 2.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border-radius: var(--ui-radius) !important;
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.1;
    text-decoration: none !important;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.ui-btn:hover,
.btn:hover {
    transform: translateY(-1px);
}

.ui-btn-primary,
.btn-primary,
.btn-brand-primary {
    border-color: var(--brand-primary, var(--ui-primary)) !important;
    background: var(--brand-primary, var(--ui-primary)) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(37, 99, 235, 0.14);
}

.ui-btn-primary:hover,
.btn-primary:hover,
.btn-brand-primary:hover {
    border-color: var(--brand-primary, var(--ui-primary-hover)) !important;
    background: var(--brand-primary, var(--ui-primary-hover)) !important;
    color: #ffffff !important;
}

.ui-btn-secondary,
.btn-outline-secondary,
.btn-light {
    border: 1px solid var(--ui-border) !important;
    background: #ffffff !important;
    color: #334155 !important;
    box-shadow: var(--ui-shadow-subtle);
}

.ui-btn-secondary:hover,
.btn-outline-secondary:hover,
.btn-light:hover {
    border-color: #cbd5e1 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
}

.ui-btn-ghost {
    border: 1px solid transparent;
    background: transparent;
    color: var(--ui-text-muted);
}

.ui-btn-ghost:hover {
    background: #f1f5f9;
    color: var(--ui-text);
}

.ui-btn-danger,
.btn-danger {
    border-color: #fecaca !important;
    background: #fef2f2 !important;
    color: var(--ui-danger) !important;
}

.ui-btn-danger:hover,
.btn-danger:hover {
    border-color: #fca5a5 !important;
    background: #fee2e2 !important;
    color: #991b1b !important;
}

.ui-input,
.ui-select,
.form-control,
.form-select {
    min-height: 2.65rem;
    border-radius: var(--ui-radius) !important;
    border: 1px solid #dbe3ef !important;
    background-color: #ffffff !important;
    color: var(--ui-text) !important;
    font-size: 0.92rem;
    font-weight: 650;
    box-shadow: none !important;
}

.ui-input:focus,
.ui-select:focus,
.form-control:focus,
.form-select:focus {
    border-color: rgba(37, 99, 235, 0.72) !important;
    box-shadow: var(--ui-focus) !important;
}

textarea.form-control,
textarea.ui-input {
    line-height: 1.5;
}

.ui-label,
.form-label {
    color: #475569;
    font-size: 0.8rem;
    font-weight: 800;
    margin-bottom: 0.35rem;
}

.ui-help {
    color: var(--ui-text-muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.ui-badge,
.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px !important;
    padding: 0.32rem 0.62rem;
    font-size: 0.73rem;
    font-weight: 850;
    line-height: 1;
}

.ui-badge-muted {
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #475569;
}

.ui-badge-success {
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
}

.ui-badge-warning {
    border: 1px solid #fed7aa;
    background: #fff7ed;
    color: #c2410c;
}

.ui-badge-danger {
    border: 1px solid #fecaca;
    background: #fef2f2;
    color: #b91c1c;
}

.ui-table,
.table {
    color: var(--ui-text);
    vertical-align: middle;
}

.table > :not(caption) > * > * {
    padding: 0.85rem 0.9rem;
    border-bottom-color: #e2e8f0;
}

.table thead th {
    color: #64748b;
    background: #f8fafc;
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.table tbody tr:hover > * {
    background: #f8fafc;
}

.card {
    border: 1px solid var(--ui-border-soft) !important;
    border-radius: var(--ui-radius-xl) !important;
    box-shadow: var(--ui-shadow-subtle) !important;
}

.card-header {
    border-bottom-color: var(--ui-border-soft) !important;
    background: #f8fafc !important;
}

.alert {
    border-radius: var(--ui-radius-lg) !important;
    border-width: 1px !important;
    font-weight: 650;
}

.dropdown-menu {
    border: 1px solid var(--ui-border-soft) !important;
    border-radius: var(--ui-radius-lg) !important;
    box-shadow: var(--ui-shadow-soft) !important;
}

/* Poprawa istniejących paneli zamówień bez zmiany logiki */

.orders-filter-card,
.orders-results-panel .card,
.oc-dashboard-card {
    border: 1px solid var(--ui-border-soft) !important;
    border-radius: var(--ui-radius-xl) !important;
    box-shadow: var(--ui-shadow-subtle) !important;
}

.orders-filter-header {
    border-bottom-color: var(--ui-border-soft);
}

.orders-filter-header h2 {
    font-size: 1.15rem;
    letter-spacing: -0.025em;
}

.orders-filter-eyebrow {
    color: var(--ui-text-soft);
}

.orders-filter-clear {
    min-height: 2.25rem;
    border-radius: 999px;
    border-color: var(--ui-border);
    background: #ffffff;
    color: #475569;
    box-shadow: var(--ui-shadow-subtle);
}

.orders-filter-clear:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #0f172a;
}

.oc-card-number {
    background: #eff6ff;
    color: var(--ui-primary);
    box-shadow: inset 0 0 0 1px #dbeafe;
}

/* Shell aplikacji */

.app-shell-bg {
    background:
        radial-gradient(circle at 0 0, rgba(37, 99, 235, 0.08), transparent 30rem),
        linear-gradient(180deg, #f8fafc 0%, #f6f8fb 48%, #eef2f7 100%);
}

.app-header-clean {
    border-bottom: 1px solid rgba(226, 232, 240, 0.86);
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(18px);
}

.app-nav-clean {
    border: 1px solid rgba(226, 232, 240, 0.86);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: var(--ui-shadow-subtle);
}

.app-nav-clean a {
    border-radius: 0.95rem !important;
}

.app-nav-clean a:hover {
    background: #f8fafc !important;
    box-shadow: none !important;
}

@media (max-width: 768px) {
    .ui-page {
        padding: 0.85rem;
    }

    .ui-card-header {
        flex-direction: column;
        align-items: stretch;
    }

    .ui-actions {
        width: 100%;
    }

    .ui-actions .ui-btn,
    .ui-actions .btn {
        flex: 1 1 auto;
    }

    .table-responsive {
        border-radius: var(--ui-radius-lg);
    }
}


/* =========================================================
   ORDERS LIST CLEAN UI v1
   ========================================================= */

.orders-hero-clean {
    background:
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.orders-hero-clean h1 {
    letter-spacing: -0.045em;
}

.orders-filter-sidebar {
    z-index: 3;
}

.orders-filter-card-clean {
    box-shadow: var(--ui-shadow-subtle) !important;
}

.orders-filter-card-clean form {
    gap: 1rem;
}

.orders-filter-card-clean label span,
.orders-filter-card-clean .orders-range-label {
    color: #64748b !important;
    letter-spacing: 0.09em !important;
    font-size: 0.68rem !important;
}

.orders-clean-input,
.orders-clean-select,
.orders-range-input {
    min-height: 2.65rem !important;
    border-radius: 1rem !important;
    border-color: #dbe3ef !important;
    background: #ffffff !important;
    font-size: 0.88rem !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.orders-clean-input:focus,
.orders-clean-select:focus,
.orders-range-input:focus {
    border-color: rgba(37, 99, 235, 0.7) !important;
    box-shadow: var(--ui-focus) !important;
}

.orders-range-filter {
    display: grid;
    gap: 0.5rem;
}

.orders-range-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}

.orders-range-input {
    width: 100%;
    padding: 0.65rem 0.75rem;
    color: #0f172a;
}

.orders-sort-panel-clean {
    box-shadow: var(--ui-shadow-subtle) !important;
}

.orders-card-clean {
    box-shadow: var(--ui-shadow-subtle) !important;
    background: #ffffff !important;
}

.orders-card-clean:hover {
    transform: translateY(-1px);
    box-shadow: var(--ui-shadow-soft) !important;
}

.orders-card-clean .tw-rounded-2xl.tw-bg-slate-50 {
    border: 1px solid #e2e8f0;
    background: #f8fafc !important;
}

.orders-card-clean [class*="tw-bg-blue-50"],
.orders-card-clean [class*="tw-bg-cyan-50"],
.orders-card-clean [class*="tw-bg-slate-100"],
.orders-card-clean [class*="tw-bg-amber-100"] {
    border: 1px solid rgba(226, 232, 240, 0.78);
}

.orders-card-clean [class*="tw-text-[11px]"] {
    font-size: 0.72rem !important;
    letter-spacing: 0.045em;
}

.orders-mobile-actions {
    display: none;
}

.orders-mobile-filter-button {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    border: 1px solid var(--ui-border-soft);
    border-radius: 1.25rem;
    background: #ffffff;
    padding: 0.85rem 1rem;
    color: #0f172a;
    box-shadow: var(--ui-shadow-subtle);
}

.orders-mobile-filter-icon {
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.9rem;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 900;
}

.orders-mobile-filter-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    text-align: left;
}

.orders-mobile-filter-text strong {
    font-size: 0.9rem;
    line-height: 1.1;
}

.orders-mobile-filter-text small {
    margin-top: 0.15rem;
    color: #64748b;
    font-size: 0.75rem;
}

.orders-mobile-filter-arrow {
    color: #94a3b8;
    font-weight: 900;
}

.orders-bulk-bar {
    border-radius: 1.25rem;
    border: 1px solid #dbeafe;
    background: #eff6ff;
    box-shadow: var(--ui-shadow-subtle);
}

.orders-bulk-bar-inner {
    padding: 0.95rem;
}

.orders-bulk-button {
    border-radius: 0.9rem !important;
}

@media (max-width: 1279px) {
    .orders-filter-sidebar {
        position: static !important;
    }
}

@media (max-width: 991px) {
    .orders-mobile-actions {
        display: block;
    }

    .orders-filter-sidebar {
        display: none;
    }

    .orders-filter-sidebar.is-open {
        display: block;
    }
}

@media (max-width: 640px) {
    .orders-hero-clean {
        border-radius: 1.25rem !important;
        padding: 1.15rem !important;
    }

    .orders-hero-clean h1 {
        font-size: 2rem !important;
    }

    .orders-card-clean {
        border-radius: 1rem !important;
        padding: 0.9rem !important;
    }

    .orders-range-grid {
        grid-template-columns: 1fr;
    }

    .orders-sort-panel-clean form {
        gap: 0.85rem;
    }
}


/* =========================================================
   RESTORE DARK SECTION HEADERS
   Przywraca ciemny/navy styl głównych nagłówków sekcji
   ========================================================= */

.orders-hero-clean,
.calendar-hero,
.calendar-header,
.page-hero,
.ui-page-hero {
    background:
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.22), transparent 28rem),
        linear-gradient(135deg, #020617 0%, #0f172a 58%, #111827 100%) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16) !important;
}

.orders-hero-clean h1,
.calendar-hero h1,
.calendar-header h1,
.page-hero h1,
.ui-page-hero h1 {
    color: #ffffff !important;
}

.orders-hero-clean p,
.calendar-hero p,
.calendar-header p,
.page-hero p,
.ui-page-hero p,
.orders-hero-clean .tw-text-slate-500,
.calendar-hero .tw-text-slate-500,
.calendar-header .tw-text-slate-500,
.page-hero .tw-text-slate-500,
.ui-page-hero .tw-text-slate-500 {
    color: #cbd5e1 !important;
}

.orders-hero-clean .tw-text-blue-700,
.calendar-hero .tw-text-blue-700,
.calendar-header .tw-text-blue-700,
.page-hero .tw-text-blue-700,
.ui-page-hero .tw-text-blue-700 {
    color: #bfdbfe !important;
}

.orders-hero-clean .tw-bg-blue-50,
.calendar-hero .tw-bg-blue-50,
.calendar-header .tw-bg-blue-50,
.page-hero .tw-bg-blue-50,
.ui-page-hero .tw-bg-blue-50 {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.orders-hero-clean .ui-btn-primary,
.orders-hero-clean .ui-btn-secondary,
.calendar-hero .ui-btn-primary,
.calendar-hero .ui-btn-secondary,
.calendar-header .ui-btn-primary,
.calendar-header .ui-btn-secondary,
.page-hero .ui-btn-primary,
.page-hero .ui-btn-secondary,
.ui-page-hero .ui-btn-primary,
.ui-page-hero .ui-btn-secondary {
    background: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.72) !important;
    color: #0f172a !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16) !important;
}

.orders-hero-clean .ui-btn-secondary,
.calendar-hero .ui-btn-secondary,
.calendar-header .ui-btn-secondary,
.page-hero .ui-btn-secondary,
.ui-page-hero .ui-btn-secondary {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
}

.orders-hero-clean .ui-btn-secondary:hover,
.calendar-hero .ui-btn-secondary:hover,
.calendar-header .ui-btn-secondary:hover,
.page-hero .ui-btn-secondary:hover,
.ui-page-hero .ui-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
}


/* =========================================================
   CALENDAR + PLANNER RESPONSIVE PATCH v1
   Zakres: tylko responsywność, bez zmian logiki i bez redesignu
   ========================================================= */

.calendar-layout,
.planner-grid-week,
.planner-grid-month {
    min-width: 0;
}

.oc-page {
    width: 100%;
    min-width: 0;
}

.oc-page > .d-flex:first-child {
    min-width: 0;
}

.oc-page > .d-flex:first-child > div {
    min-width: 0;
}

.calendar-side,
.calendar-side .card,
.calendar-side .card-body,
.planner-nav-card,
.planner-nav-card > .d-flex {
    min-width: 0;
}

.calendar-side-list {
    overflow-x: hidden;
}

.calendar-order-row,
.calendar-event-row,
.planner-card,
.planner-week-card {
    min-width: 0;
    overflow-wrap: anywhere;
}

.calendar-order-row .fw-bold,
.calendar-event-row .fw-bold,
.planner-card .fw-bold,
.planner-week-card .fw-bold {
    overflow-wrap: anywhere;
}

.planner-view-switch {
    min-width: 0;
}

.planner-view-switch a {
    min-width: 0;
    white-space: nowrap;
}

.planner-nav-card .form-control,
.planner-nav-card .form-select {
    max-width: 100%;
}

@media (max-width: 1199.98px) {
    .calendar-layout {
        grid-template-columns: 1fr !important;
    }

    .calendar-side {
        position: static !important;
        top: auto !important;
    }

    .planner-grid-week {
        grid-template-columns: 1fr !important;
    }

    .planner-week-column {
        min-height: auto !important;
    }

    .planner-nav-card > .d-flex {
        align-items: stretch !important;
    }
}

@media (max-width: 991.98px) {
    .oc-page > .d-flex:first-child {
        align-items: stretch !important;
    }

    .oc-page > .d-flex:first-child > div:last-child {
        width: 100%;
    }

    .oc-page > .d-flex:first-child .btn {
        flex: 1 1 auto;
    }

    .calendar-layout {
        gap: 1rem !important;
    }

    .calendar-side .card {
        margin-bottom: 1rem !important;
    }

    .planner-nav-card .d-flex.flex-wrap {
        width: 100%;
    }

    .planner-nav-card .btn {
        flex: 1 1 auto;
    }

    .planner-view-switch {
        max-width: none !important;
        width: 100% !important;
    }
}

@media (max-width: 767.98px) {
    .oc-page {
        gap: 1rem !important;
    }

    .oc-page > .d-flex:first-child {
        padding: 1rem !important;
        border-radius: 1.25rem !important;
    }

    .oc-page h1,
    .oc-page .h3 {
        font-size: clamp(1.85rem, 12vw, 2.45rem) !important;
        line-height: 1 !important;
    }

    .oc-page > .d-flex:first-child p,
    .oc-page > .d-flex:first-child .text-muted {
        font-size: 0.88rem !important;
        line-height: 1.45 !important;
    }

    .oc-page > .d-flex:first-child > div:last-child {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 0.55rem !important;
    }

    .oc-page > .d-flex:first-child .btn {
        width: 100%;
        justify-content: center;
        min-height: 2.75rem;
    }

    .calendar-grid {
        grid-template-columns: 1fr !important;
        gap: 0.65rem !important;
    }

    .calendar-weekday,
    .planner-weekday {
        display: none !important;
    }

    .calendar-day {
        min-height: auto !important;
        padding: 0.8rem !important;
    }

    .calendar-day > .d-flex {
        align-items: center !important;
    }

    .calendar-counts {
        margin-top: 0.7rem !important;
    }

    .calendar-count-pill,
    .planner-count-pill {
        font-size: 0.72rem !important;
        padding: 0.28rem 0.55rem !important;
    }

    .calendar-side-list {
        max-height: 280px !important;
    }

    .calendar-side .card-body,
    .oc-page .card-body {
        padding: 1rem !important;
    }

    .calendar-side h2,
    .calendar-side .h5,
    .calendar-side h3,
    .calendar-side .h6 {
        line-height: 1.15 !important;
    }

    .planner-view-switch {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    .planner-view-switch a {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
        font-size: 0.82rem !important;
        text-align: center;
    }

    .planner-nav-card {
        padding: 1rem !important;
        border-radius: 1.25rem !important;
    }

    .planner-nav-card > .d-flex {
        gap: 0.85rem !important;
    }

    .planner-nav-card .d-flex.flex-wrap {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 0.55rem !important;
    }

    .planner-nav-card .text-md-end {
        text-align: left !important;
    }

    .planner-nav-card input[type="date"] {
        max-width: none !important;
        width: 100% !important;
    }

    .planner-grid-month {
        grid-template-columns: 1fr !important;
        gap: 0.65rem !important;
    }

    .planner-month-day,
    .planner-week-column,
    .planner-card,
    .planner-week-card {
        border-radius: 1rem !important;
    }

    .planner-month-day {
        min-height: auto !important;
        padding: 0.85rem !important;
    }

    .planner-week-column {
        padding: 0.85rem !important;
    }

    .planner-card {
        padding: 0.85rem !important;
    }

    .planner-card .d-flex.gap-3.align-items-start {
        gap: 0.75rem !important;
    }

    .planner-card .d-flex.flex-column.flex-lg-row {
        gap: 0.75rem !important;
    }

    .planner-card .d-flex.flex-wrap,
    .planner-week-card .d-flex.flex-wrap {
        gap: 0.4rem !important;
    }

    .planner-card .btn,
    .planner-week-card .btn {
        width: 100%;
        justify-content: center;
    }

    .planner-day-list {
        gap: 0.7rem !important;
    }

    .planner-empty,
    .calendar-empty {
        padding: 0.85rem !important;
    }
}

@media (max-width: 480px) {
    .oc-page {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .oc-page > .d-flex:first-child,
    .planner-nav-card,
    .oc-page .card,
    .calendar-day,
    .planner-week-column,
    .planner-month-day,
    .planner-card {
        border-radius: 1rem !important;
    }

    .oc-page h1,
    .oc-page .h3 {
        font-size: 2rem !important;
    }

    .calendar-counts,
    .planner-month-day .d-flex.flex-wrap {
        gap: 0.35rem !important;
    }

    .calendar-count-pill,
    .planner-count-pill,
    .badge {
        max-width: 100%;
        white-space: normal !important;
    }

    .planner-handle {
        width: 1.5rem;
        flex: 0 0 1.5rem;
        text-align: center;
    }
}


/* PERSONALIZED CYCLE FILTER COUNTERS FIX v2 */
.personalized-cycle-page .cycle-filter-grid,
.personalized-cycle-page .cycle-status-grid,
.personalized-cycle-page .cycle-stats-grid,
.personalized-cycle-page .cycle-tabs-grid {
    overflow: visible;
}

.personalized-cycle-page .cycle-filter-card,
.personalized-cycle-page .cycle-status-card,
.personalized-cycle-page .cycle-stat-card,
.personalized-cycle-page .cycle-tab-card,
.personalized-cycle-page .cycle-filter-tile,
.personalized-cycle-page .cycle-status-tile {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate;
    padding-right: 58px !important;
}

.personalized-cycle-page .cycle-filter-card .cycle-count,
.personalized-cycle-page .cycle-status-card .cycle-count,
.personalized-cycle-page .cycle-stat-card .cycle-count,
.personalized-cycle-page .cycle-tab-card .cycle-count,
.personalized-cycle-page .cycle-filter-tile .cycle-count,
.personalized-cycle-page .cycle-status-tile .cycle-count,
.personalized-cycle-page .cycle-filter-card .cycle-badge,
.personalized-cycle-page .cycle-status-card .cycle-badge,
.personalized-cycle-page .cycle-stat-card .cycle-badge,
.personalized-cycle-page .cycle-tab-card .cycle-badge,
.personalized-cycle-page .cycle-filter-card .count,
.personalized-cycle-page .cycle-status-card .count,
.personalized-cycle-page .cycle-stat-card .count,
.personalized-cycle-page .cycle-tab-card .count {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;

    z-index: 2 !important;
    min-width: 34px !important;
    height: 34px !important;
    max-width: 46px !important;
    padding: 0 8px !important;

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

    border-radius: 999px !important;
    background: #0f172a !important;
    color: #fff !important;

    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;

    box-shadow: 0 10px 22px rgba(15, 23, 42, .18) !important;
    white-space: nowrap !important;
}

.personalized-cycle-page .cycle-filter-card.is-active .cycle-count,
.personalized-cycle-page .cycle-status-card.is-active .cycle-count,
.personalized-cycle-page .cycle-stat-card.is-active .cycle-count,
.personalized-cycle-page .cycle-tab-card.is-active .cycle-count,
.personalized-cycle-page .cycle-filter-card.active .cycle-count,
.personalized-cycle-page .cycle-status-card.active .cycle-count,
.personalized-cycle-page .cycle-stat-card.active .cycle-count,
.personalized-cycle-page .cycle-tab-card.active .cycle-count {
    background: #2563eb !important;
}

@media (max-width: 900px) {
    .personalized-cycle-page .cycle-filter-card,
    .personalized-cycle-page .cycle-status-card,
    .personalized-cycle-page .cycle-stat-card,
    .personalized-cycle-page .cycle-tab-card,
    .personalized-cycle-page .cycle-filter-tile,
    .personalized-cycle-page .cycle-status-tile {
        padding-right: 52px !important;
    }

    .personalized-cycle-page .cycle-filter-card .cycle-count,
    .personalized-cycle-page .cycle-status-card .cycle-count,
    .personalized-cycle-page .cycle-stat-card .cycle-count,
    .personalized-cycle-page .cycle-tab-card .cycle-count,
    .personalized-cycle-page .cycle-filter-tile .cycle-count,
    .personalized-cycle-page .cycle-status-tile .cycle-count,
    .personalized-cycle-page .cycle-filter-card .cycle-badge,
    .personalized-cycle-page .cycle-status-card .cycle-badge,
    .personalized-cycle-page .cycle-stat-card .cycle-badge,
    .personalized-cycle-page .cycle-tab-card .cycle-badge,
    .personalized-cycle-page .cycle-filter-card .count,
    .personalized-cycle-page .cycle-status-card .count,
    .personalized-cycle-page .cycle-stat-card .count,
    .personalized-cycle-page .cycle-tab-card .count {
        top: 12px !important;
        right: 12px !important;
        min-width: 30px !important;
        height: 30px !important;
        max-width: 42px !important;
        font-size: 12px !important;
    }
}
/* END PERSONALIZED CYCLE FILTER COUNTERS FIX v2 */

/* AUTH / 2FA / PIN DARK RESTORE v2 */
body:has(input[name="username"]),
body:has(input[name="password"]),
body:has(input[name="token"]),
body:has(input[name="otp_token"]),
body:has(input[name="code"]),
body:has(input[name="pin"]),
body:has(.two-factor-page),
body:has(.two-factor-card),
body:has(.auth-page),
body:has(.auth-card),
body:has(.login-page),
body:has(.login-card),
body:has(.pin-page),
body:has(.pin-card) {
    background:
        radial-gradient(circle at 50% 0%, rgba(37, 99, 235, .30), transparent 34%),
        radial-gradient(circle at 12% 18%, rgba(59, 130, 246, .18), transparent 30%),
        radial-gradient(circle at 88% 18%, rgba(14, 165, 233, .12), transparent 28%),
        linear-gradient(135deg, #020617 0%, #0f172a 52%, #111827 100%) !important;
    color: #e5e7eb !important;
    min-height: 100vh !important;
}

body:has(input[name="username"]) main,
body:has(input[name="password"]) main,
body:has(input[name="token"]) main,
body:has(input[name="otp_token"]) main,
body:has(input[name="code"]) main,
body:has(input[name="pin"]) main,
.auth-page,
.login-page,
.pin-page,
.code-page,
.two-factor-page,
.verify-page {
    background:
        radial-gradient(circle at 50% 0%, rgba(37, 99, 235, .30), transparent 34%),
        radial-gradient(circle at 12% 18%, rgba(59, 130, 246, .18), transparent 30%),
        radial-gradient(circle at 88% 18%, rgba(14, 165, 233, .12), transparent 28%),
        linear-gradient(135deg, #020617 0%, #0f172a 52%, #111827 100%) !important;
    color: #e5e7eb !important;
    min-height: 100vh !important;
}

/* Hero / nagłówek ekranu logowania */
body:has(input[name="username"]) h1,
body:has(input[name="password"]) h1,
body:has(input[name="token"]) h1,
body:has(input[name="otp_token"]) h1,
body:has(input[name="code"]) h1,
body:has(input[name="pin"]) h1,
.auth-page h1,
.login-page h1,
.pin-page h1,
.two-factor-page h1 {
    color: #ffffff !important;
    text-shadow: 0 14px 40px rgba(0, 0, 0, .42) !important;
}

body:has(input[name="username"]) h2,
body:has(input[name="password"]) h2,
body:has(input[name="token"]) h2,
body:has(input[name="otp_token"]) h2,
body:has(input[name="code"]) h2,
body:has(input[name="pin"]) h2,
body:has(input[name="username"]) p,
body:has(input[name="password"]) p,
body:has(input[name="token"]) p,
body:has(input[name="otp_token"]) p,
body:has(input[name="code"]) p,
body:has(input[name="pin"]) p,
.auth-page p,
.login-page p,
.pin-page p,
.two-factor-page p {
    color: #cbd5e1 !important;
}

/* Logo / badge 2FA */
body:has(input[name="username"]) [class*="logo"],
body:has(input[name="password"]) [class*="logo"],
body:has(input[name="token"]) [class*="logo"],
body:has(input[name="otp_token"]) [class*="logo"],
body:has(input[name="code"]) [class*="logo"],
body:has(input[name="pin"]) [class*="logo"],
body:has(input[name="username"]) [class*="badge"],
body:has(input[name="password"]) [class*="badge"],
body:has(input[name="token"]) [class*="badge"],
body:has(input[name="otp_token"]) [class*="badge"],
body:has(input[name="code"]) [class*="badge"],
body:has(input[name="pin"]) [class*="badge"] {
    box-shadow: 0 18px 55px rgba(37, 99, 235, .24) !important;
}

/* Karta formularza */
body:has(input[name="username"]) form,
body:has(input[name="password"]) form,
body:has(input[name="token"]) form,
body:has(input[name="otp_token"]) form,
body:has(input[name="code"]) form,
body:has(input[name="pin"]) form,
.auth-card,
.login-card,
.pin-card,
.code-card,
.two-factor-card,
.verify-card {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(2, 6, 23, .92)) !important;
    border: 1px solid rgba(148, 163, 184, .20) !important;
    box-shadow:
        0 28px 90px rgba(0, 0, 0, .48),
        inset 0 1px 0 rgba(255, 255, 255, .05) !important;
    color: #e5e7eb !important;
    backdrop-filter: blur(18px) !important;
}

/* Boxy informacyjne wewnątrz formularzy */
body:has(input[name="username"]) form > div,
body:has(input[name="password"]) form > div,
body:has(input[name="token"]) form > div,
body:has(input[name="otp_token"]) form > div,
body:has(input[name="code"]) form > div,
body:has(input[name="pin"]) form > div {
    color: #cbd5e1 !important;
}

body:has(input[name="username"]) form .tw-bg-slate-100,
body:has(input[name="password"]) form .tw-bg-slate-100,
body:has(input[name="token"]) form .tw-bg-slate-100,
body:has(input[name="otp_token"]) form .tw-bg-slate-100,
body:has(input[name="code"]) form .tw-bg-slate-100,
body:has(input[name="pin"]) form .tw-bg-slate-100,
body:has(input[name="username"]) form [class*="bg-slate"],
body:has(input[name="password"]) form [class*="bg-slate"],
body:has(input[name="token"]) form [class*="bg-slate"],
body:has(input[name="otp_token"]) form [class*="bg-slate"],
body:has(input[name="code"]) form [class*="bg-slate"],
body:has(input[name="pin"]) form [class*="bg-slate"] {
    background: rgba(30, 41, 59, .86) !important;
    border-color: rgba(148, 163, 184, .18) !important;
    color: #e5e7eb !important;
}

/* Labelki */
body:has(input[name="username"]) label,
body:has(input[name="password"]) label,
body:has(input[name="token"]) label,
body:has(input[name="otp_token"]) label,
body:has(input[name="code"]) label,
body:has(input[name="pin"]) label,
.auth-card label,
.login-card label,
.pin-card label,
.two-factor-card label {
    color: #94a3b8 !important;
    letter-spacing: .12em !important;
}

/* Inputy */
body:has(input[name="username"]) input,
body:has(input[name="password"]) input,
body:has(input[name="token"]) input,
body:has(input[name="otp_token"]) input,
body:has(input[name="code"]) input,
body:has(input[name="pin"]) input,
.auth-card input,
.login-card input,
.pin-card input,
.code-card input,
.two-factor-card input {
    background: rgba(2, 6, 23, .82) !important;
    border: 1px solid rgba(148, 163, 184, .24) !important;
    color: #ffffff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .04),
        0 10px 24px rgba(0, 0, 0, .12) !important;
}

body:has(input[name="username"]) input::placeholder,
body:has(input[name="password"]) input::placeholder,
body:has(input[name="token"]) input::placeholder,
body:has(input[name="otp_token"]) input::placeholder,
body:has(input[name="code"]) input::placeholder,
body:has(input[name="pin"]) input::placeholder {
    color: #64748b !important;
}

body:has(input[name="username"]) input:focus,
body:has(input[name="password"]) input:focus,
body:has(input[name="token"]) input:focus,
body:has(input[name="otp_token"]) input:focus,
body:has(input[name="code"]) input:focus,
body:has(input[name="pin"]) input:focus {
    border-color: rgba(96, 165, 250, .95) !important;
    outline: none !important;
    box-shadow:
        0 0 0 4px rgba(37, 99, 235, .22),
        inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

/* Przyciski */
body:has(input[name="username"]) button,
body:has(input[name="password"]) button,
body:has(input[name="token"]) button,
body:has(input[name="otp_token"]) button,
body:has(input[name="code"]) button,
body:has(input[name="pin"]) button,
.auth-card button,
.login-card button,
.pin-card button,
.code-card button,
.two-factor-card button {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    border-color: rgba(147, 197, 253, .42) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 36px rgba(37, 99, 235, .34) !important;
}

body:has(input[name="username"]) button:hover,
body:has(input[name="password"]) button:hover,
body:has(input[name="token"]) button:hover,
body:has(input[name="otp_token"]) button:hover,
body:has(input[name="code"]) button:hover,
body:has(input[name="pin"]) button:hover {
    filter: brightness(1.08) !important;
}

/* Teksty pomocnicze */
body:has(input[name="username"]) small,
body:has(input[name="password"]) small,
body:has(input[name="token"]) small,
body:has(input[name="otp_token"]) small,
body:has(input[name="code"]) small,
body:has(input[name="pin"]) small,
body:has(input[name="username"]) .helptext,
body:has(input[name="password"]) .helptext,
body:has(input[name="token"]) .helptext,
body:has(input[name="otp_token"]) .helptext,
body:has(input[name="code"]) .helptext,
body:has(input[name="pin"]) .helptext {
    color: #94a3b8 !important;
}

/* Linki */
body:has(input[name="username"]) a,
body:has(input[name="password"]) a,
body:has(input[name="token"]) a,
body:has(input[name="otp_token"]) a,
body:has(input[name="code"]) a,
body:has(input[name="pin"]) a {
    color: #93c5fd !important;
}

/* Błędy */
body:has(input[name="username"]) .errorlist,
body:has(input[name="password"]) .errorlist,
body:has(input[name="token"]) .errorlist,
body:has(input[name="otp_token"]) .errorlist,
body:has(input[name="code"]) .errorlist,
body:has(input[name="pin"]) .errorlist,
body:has(input[name="username"]) .alert,
body:has(input[name="password"]) .alert,
body:has(input[name="token"]) .alert,
body:has(input[name="otp_token"]) .alert,
body:has(input[name="code"]) .alert,
body:has(input[name="pin"]) .alert {
    background: rgba(127, 29, 29, .30) !important;
    border: 1px solid rgba(248, 113, 113, .30) !important;
    color: #fecaca !important;
}
/* END AUTH / 2FA / PIN DARK RESTORE v2 */

/* USER MENU LAYER FIX v1 */
.user-menu,
.user-dropdown,
.account-menu,
.account-dropdown,
.profile-menu,
.profile-dropdown,
[data-user-menu],
[data-account-menu] {
    position: relative;
    z-index: 9999 !important;
}

.user-menu-panel,
.user-dropdown-panel,
.account-menu-panel,
.account-dropdown-panel,
.profile-menu-panel,
.profile-dropdown-panel,
[data-user-menu-panel],
[data-account-menu-panel],
.dropdown-menu,
.du-dropdown-content {
    z-index: 10050 !important;
    position: absolute;
}

header,
nav,
.topbar,
.app-header,
.main-header,
.navbar,
.pwa-topbar {
    overflow: visible !important;
}

.pwa-bottom-nav,
.mobile-bottom-nav,
.bottom-nav,
.app-bottom-nav {
    z-index: 9000 !important;
}
/* END USER MENU LAYER FIX v1 */

/* ACCOUNT MENU ABOVE NAV FIX v2 */
.account-menu-dropdown {
    position: relative !important;
    z-index: 99999 !important;
}

.account-menu-dropdown[open] {
    z-index: 99999 !important;
}

.account-menu-panel {
    position: absolute !important;
    z-index: 100000 !important;
    top: 100% !important;
    right: 0 !important;
    isolation: isolate !important;
}

/* Header musi pozwalać dropdownowi wyjść poza własny obszar */
header,
header > div,
.app-header,
.topbar,
.navbar {
    overflow: visible !important;
}

/* Nawigacja niżej niż menu konta */
header nav,
.pwa-category-nav,
.pwa-bottom-nav,
.mobile-bottom-nav,
.bottom-nav,
.app-bottom-nav {
    z-index: 10 !important;
}
/* END ACCOUNT MENU ABOVE NAV FIX v2 */

/* ACCOUNT MENU ABOVE NAV FIX v2 */
.account-menu-dropdown {
    position: relative !important;
    z-index: 99999 !important;
}

.account-menu-dropdown[open] {
    z-index: 99999 !important;
}

.account-menu-panel {
    position: absolute !important;
    z-index: 100000 !important;
    top: 100% !important;
    right: 0 !important;
    isolation: isolate !important;
}

/* Header musi pozwalać dropdownowi wyjść poza własny obszar */
header,
header > div,
.app-header,
.topbar,
.navbar {
    overflow: visible !important;
}

/* Nawigacja niżej niż menu konta */
header nav,
.pwa-category-nav,
.pwa-bottom-nav,
.mobile-bottom-nav,
.bottom-nav,
.app-bottom-nav {
    z-index: 10 !important;
}
/* END ACCOUNT MENU ABOVE NAV FIX v2 */

/* ACCOUNT MENU FIXED FALLBACK v1 */
.account-menu-dropdown[open] .account-menu-panel {
    position: fixed !important;
    top: 5.25rem !important;
    right: max(1rem, calc((100vw - 80rem) / 2 + 1.5rem)) !important;
    z-index: 2147483000 !important;
}
/* END ACCOUNT MENU FIXED FALLBACK v1 */

/* ACCOUNT MENU OVER PWA CATEGORY TABS FIX v3 */
.account-menu-dropdown,
.account-menu-dropdown[open],
.account-menu-dropdown[open] summary,
.account-menu-dropdown[open] .account-menu-panel {
    z-index: 2147483000 !important;
}

.account-menu-dropdown[open] .account-menu-panel {
    position: absolute !important;
    isolation: isolate !important;
}

/* Te zakładki przykrywały dropdown konta */
.pwa-category-nav,
.pwa-category-tab,
.pwa-category-tab.is-active,
.pwa-category-tab:hover,
nav .pwa-category-nav,
nav .pwa-category-tab,
header nav,
header nav a {
    position: relative !important;
    z-index: 1 !important;
}

/* Header i jego wrappery nie mogą tworzyć niższej warstwy dla dropdownu */
header,
header > div,
header .tw-mx-auto,
header .tw-rounded-3xl,
header .tw-flex,
header .tw-grid {
    overflow: visible !important;
}

/* Górny pasek z przyciskiem Dodaj i menu musi być nad navem */
header .account-menu-dropdown {
    position: relative !important;
    z-index: 2147483000 !important;
}
/* END ACCOUNT MENU OVER PWA CATEGORY TABS FIX v3 */

/* ACCOUNT MENU FIXED ABOVE EVERYTHING v2 */
.account-menu-dropdown[open] .account-menu-panel {
    position: fixed !important;
    top: 4.25rem !important;
    right: max(1rem, calc((100vw - 80rem) / 2 + 1.5rem)) !important;
    z-index: 2147483647 !important;
}
/* END ACCOUNT MENU FIXED ABOVE EVERYTHING v2 */

/* ACCOUNT MENU FIXED PORTAL-LIKE POSITION v4 */
.account-menu-fixed {
    position: fixed !important;
    top: 1.35rem !important;
    right: max(1rem, calc((100vw - 80rem) / 2 + 1.5rem)) !important;
    z-index: 2147483647 !important;
    isolation: isolate !important;
}

.account-menu-fixed[open] {
    z-index: 2147483647 !important;
}

.account-menu-trigger {
    position: relative !important;
    z-index: 2147483647 !important;
}

.account-menu-panel-fixed {
    position: absolute !important;
    top: calc(100% + 0.55rem) !important;
    right: 0 !important;
    z-index: 2147483647 !important;
    background: #ffffff !important;
    box-shadow:
        0 28px 80px rgba(15, 23, 42, 0.26),
        0 0 0 1px rgba(226, 232, 240, 0.95) !important;
}

/* Zakładki i nav zawsze niżej niż menu konta */
.pwa-category-nav,
.pwa-category-tab,
.pwa-category-tab.is-active,
header nav,
header nav a,
nav,
nav a {
    z-index: 1 !important;
}

/* Gdy menu jest otwarte, niech zawsze przechwytuje kliknięcia */
.account-menu-fixed,
.account-menu-fixed * {
    pointer-events: auto !important;
}

@media (max-width: 700px) {
    .account-menu-fixed {
        top: 0.9rem !important;
        right: 0.85rem !important;
    }

    .account-menu-panel-fixed {
        right: 0 !important;
        width: min(16rem, calc(100vw - 1.5rem)) !important;
    }
}
/* END ACCOUNT MENU FIXED PORTAL-LIKE POSITION v4 */

/* ACCOUNT MENU RIGHT POSITION + NO SELECT v5 */
.account-menu-fixed {
    top: 1.35rem !important;
    right: max(1rem, calc((100vw - 80rem) / 2 + 1.5rem)) !important;
    left: auto !important;
}

.account-menu-trigger,
.account-menu-trigger *,
.account-menu-fixed summary,
.account-menu-fixed summary * {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
}

.account-menu-trigger {
    outline: none !important;
}

.account-menu-trigger::selection,
.account-menu-trigger *::selection,
.account-menu-fixed summary::selection,
.account-menu-fixed summary *::selection {
    background: transparent !important;
}

.account-menu-fixed summary::-webkit-details-marker {
    display: none !important;
}

.account-menu-fixed summary::marker {
    content: "" !important;
}
/* END ACCOUNT MENU RIGHT POSITION + NO SELECT v5 */

/* ACCOUNT MENU HARD RIGHT OVERRIDE v6 */
.account-menu-fixed {
    position: fixed !important;
    top: 1.35rem !important;
    right: 1.5rem !important;
    left: auto !important;
    transform: none !important;
    z-index: 2147483647 !important;
}

.account-menu-panel-fixed {
    right: 0 !important;
    left: auto !important;
}
/* END ACCOUNT MENU HARD RIGHT OVERRIDE v6 */

/* ACCOUNT MENU INLINE TRIGGER + PANEL ABOVE ALL v7 */
.account-menu-fixed {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
}

.account-menu-dropdown {
    position: relative !important;
    z-index: 2147483000 !important;
    isolation: isolate !important;
}

.account-menu-dropdown[open] {
    z-index: 2147483000 !important;
}

.account-menu-trigger,
.account-menu-dropdown summary {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    cursor: pointer !important;
    outline: none !important;
}

.account-menu-trigger *,
.account-menu-dropdown summary * {
    -webkit-user-select: none !important;
    user-select: none !important;
}

.account-menu-trigger::selection,
.account-menu-trigger *::selection,
.account-menu-dropdown summary::selection,
.account-menu-dropdown summary *::selection {
    background: transparent !important;
    color: inherit !important;
}

.account-menu-dropdown summary::-webkit-details-marker {
    display: none !important;
}

.account-menu-dropdown summary::marker {
    content: "" !important;
}

/* Sam panel nad zakładkami */
.account-menu-panel {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    z-index: 2147483647 !important;
    margin-top: 0.55rem !important;
    background: #ffffff !important;
    box-shadow:
        0 30px 90px rgba(15, 23, 42, 0.28),
        0 0 0 1px rgba(226, 232, 240, 0.96) !important;
}

/* Zakładki zawsze niżej */
.pwa-category-nav,
.pwa-category-tab,
.pwa-category-tab.is-active,
.pwa-category-tab:hover,
header nav,
header nav a,
nav,
nav a {
    position: relative !important;
    z-index: 1 !important;
}

/* Header nie ucina menu */
header,
header > div,
header .tw-mx-auto,
header .tw-flex,
header .tw-grid,
header .tw-rounded-3xl {
    overflow: visible !important;
}
/* END ACCOUNT MENU INLINE TRIGGER + PANEL ABOVE ALL v7 */

/* ACCOUNT MENU BUTTON + FLOATING PANEL v8 */
.account-menu-root {
    position: relative !important;
    z-index: 2147483000 !important;
}

.account-menu-trigger-button {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    appearance: none !important;
    border-style: solid !important;
    position: relative !important;
    z-index: 2147483000 !important;
}

.account-menu-trigger-button,
.account-menu-trigger-button *,
.account-menu-dots,
.account-menu-dots * {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
}

.account-menu-trigger-button::selection,
.account-menu-trigger-button *::selection {
    background: transparent !important;
}

.account-menu-dots {
    display: block !important;
    fill: currentColor !important;
    pointer-events: none !important;
}

.account-menu-floating-panel {
    position: fixed !important;
    z-index: 2147483647 !important;
    background: #ffffff !important;
    box-shadow:
        0 30px 90px rgba(15, 23, 42, 0.28),
        0 0 0 1px rgba(226, 232, 240, 0.96) !important;
}

.account-menu-floating-panel[hidden] {
    display: none !important;
}

/* Stare eksperymentalne klasy nie mogą już ruszać nowego przycisku */
.account-menu-fixed {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
}

/* Zakładki i PWA nav niżej niż floating panel */
.pwa-category-nav,
.pwa-category-tab,
.pwa-category-tab.is-active,
.pwa-category-tab:hover,
header nav,
header nav a,
nav,
nav a {
    position: relative !important;
    z-index: 1 !important;
}
/* END ACCOUNT MENU BUTTON + FLOATING PANEL v8 */

/* USER DARK THEME SERVER FALLBACK v2 */
html[data-user-theme="dark"],
html[data-effective-theme="dark"] {
    color-scheme: dark;
}

html[data-user-theme="dark"] body,
html[data-effective-theme="dark"] body {
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, 0.20), transparent 34rem),
        linear-gradient(135deg, #020617 0%, #0f172a 48%, #111827 100%) !important;
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] header,
html[data-user-theme="dark"] main,
html[data-effective-theme="dark"] header,
html[data-effective-theme="dark"] main {
    background: transparent !important;
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] .settings-card,
html[data-user-theme="dark"] .cycle-card,
html[data-user-theme="dark"] .dashboard-card,
html[data-user-theme="dark"] .order-card,
html[data-user-theme="dark"] .handoff-card,
html[data-user-theme="dark"] .planner-card,
html[data-user-theme="dark"] .calendar-card,
html[data-user-theme="dark"] .tw-bg-white,
html[data-user-theme="dark"] .tw-bg-white\/90,
html[data-user-theme="dark"] .tw-bg-white\/95,
html[data-user-theme="dark"] .card,
html[data-user-theme="dark"] .modal-content,
html[data-user-theme="dark"] .dropdown-menu,
html[data-user-theme="dark"] .list-group-item,
html[data-effective-theme="dark"] .settings-card,
html[data-effective-theme="dark"] .cycle-card,
html[data-effective-theme="dark"] .dashboard-card,
html[data-effective-theme="dark"] .order-card,
html[data-effective-theme="dark"] .handoff-card,
html[data-effective-theme="dark"] .planner-card,
html[data-effective-theme="dark"] .calendar-card,
html[data-effective-theme="dark"] .tw-bg-white,
html[data-effective-theme="dark"] .tw-bg-white\/90,
html[data-effective-theme="dark"] .tw-bg-white\/95,
html[data-effective-theme="dark"] .card,
html[data-effective-theme="dark"] .modal-content,
html[data-effective-theme="dark"] .dropdown-menu,
html[data-effective-theme="dark"] .list-group-item {
    background: rgba(15, 23, 42, 0.90) !important;
    border-color: rgba(71, 85, 105, 0.78) !important;
    color: #e5e7eb !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.30) !important;
}

html[data-user-theme="dark"] h1,
html[data-user-theme="dark"] h2,
html[data-user-theme="dark"] h3,
html[data-user-theme="dark"] h4,
html[data-user-theme="dark"] h5,
html[data-user-theme="dark"] h6,
html[data-user-theme="dark"] .settings-card-title,
html[data-user-theme="dark"] .tw-text-slate-900,
html[data-user-theme="dark"] .tw-text-gray-900,
html[data-user-theme="dark"] .tw-text-slate-800,
html[data-user-theme="dark"] .tw-text-gray-800,
html[data-user-theme="dark"] .tw-text-slate-700,
html[data-user-theme="dark"] .tw-text-gray-700,
html[data-effective-theme="dark"] h1,
html[data-effective-theme="dark"] h2,
html[data-effective-theme="dark"] h3,
html[data-effective-theme="dark"] h4,
html[data-effective-theme="dark"] h5,
html[data-effective-theme="dark"] h6,
html[data-effective-theme="dark"] .settings-card-title,
html[data-effective-theme="dark"] .tw-text-slate-900,
html[data-effective-theme="dark"] .tw-text-gray-900,
html[data-effective-theme="dark"] .tw-text-slate-800,
html[data-effective-theme="dark"] .tw-text-gray-800,
html[data-effective-theme="dark"] .tw-text-slate-700,
html[data-effective-theme="dark"] .tw-text-gray-700 {
    color: #f8fafc !important;
}

html[data-user-theme="dark"] p,
html[data-user-theme="dark"] span,
html[data-user-theme="dark"] label,
html[data-user-theme="dark"] small,
html[data-user-theme="dark"] .settings-card-desc,
html[data-user-theme="dark"] .settings-field label,
html[data-user-theme="dark"] .tw-text-slate-600,
html[data-user-theme="dark"] .tw-text-gray-600,
html[data-user-theme="dark"] .tw-text-slate-500,
html[data-user-theme="dark"] .tw-text-gray-500,
html[data-effective-theme="dark"] p,
html[data-effective-theme="dark"] span,
html[data-effective-theme="dark"] label,
html[data-effective-theme="dark"] small,
html[data-effective-theme="dark"] .settings-card-desc,
html[data-effective-theme="dark"] .settings-field label,
html[data-effective-theme="dark"] .tw-text-slate-600,
html[data-effective-theme="dark"] .tw-text-gray-600,
html[data-effective-theme="dark"] .tw-text-slate-500,
html[data-effective-theme="dark"] .tw-text-gray-500 {
    color: #cbd5e1 !important;
}

html[data-user-theme="dark"] .tw-text-slate-400,
html[data-user-theme="dark"] .tw-text-gray-400,
html[data-effective-theme="dark"] .tw-text-slate-400,
html[data-effective-theme="dark"] .tw-text-gray-400 {
    color: #94a3b8 !important;
}

html[data-user-theme="dark"] input,
html[data-user-theme="dark"] select,
html[data-user-theme="dark"] textarea,
html[data-user-theme="dark"] .form-control,
html[data-user-theme="dark"] .form-select,
html[data-user-theme="dark"] .settings-field select,
html[data-effective-theme="dark"] input,
html[data-effective-theme="dark"] select,
html[data-effective-theme="dark"] textarea,
html[data-effective-theme="dark"] .form-control,
html[data-effective-theme="dark"] .form-select,
html[data-effective-theme="dark"] .settings-field select {
    background: rgba(2, 6, 23, 0.88) !important;
    border-color: rgba(100, 116, 139, 0.86) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] input::placeholder,
html[data-user-theme="dark"] textarea::placeholder,
html[data-effective-theme="dark"] input::placeholder,
html[data-effective-theme="dark"] textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-user-theme="dark"] .settings-note,
html[data-user-theme="dark"] .tw-bg-slate-50,
html[data-user-theme="dark"] .tw-bg-gray-50,
html[data-user-theme="dark"] .tw-bg-slate-100,
html[data-user-theme="dark"] .tw-bg-gray-100,
html[data-effective-theme="dark"] .settings-note,
html[data-effective-theme="dark"] .tw-bg-slate-50,
html[data-effective-theme="dark"] .tw-bg-gray-50,
html[data-effective-theme="dark"] .tw-bg-slate-100,
html[data-effective-theme="dark"] .tw-bg-gray-100 {
    background: rgba(30, 41, 59, 0.78) !important;
    color: #cbd5e1 !important;
}

html[data-user-theme="dark"] table,
html[data-user-theme="dark"] .table,
html[data-effective-theme="dark"] table,
html[data-effective-theme="dark"] .table {
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] thead,
html[data-user-theme="dark"] .table-light,
html[data-effective-theme="dark"] thead,
html[data-effective-theme="dark"] .table-light {
    background: rgba(15, 23, 42, 0.96) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] tbody tr,
html[data-user-theme="dark"] .table > :not(caption) > * > *,
html[data-effective-theme="dark"] tbody tr,
html[data-effective-theme="dark"] .table > :not(caption) > * > * {
    background-color: rgba(15, 23, 42, 0.64) !important;
    border-color: rgba(71, 85, 105, 0.66) !important;
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] .account-menu-floating-panel,
html[data-effective-theme="dark"] .account-menu-floating-panel {
    background: #0f172a !important;
    border-color: rgba(71, 85, 105, 0.9) !important;
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] .account-menu-trigger-button,
html[data-effective-theme="dark"] .account-menu-trigger-button {
    background: rgba(15, 23, 42, 0.94) !important;
    border-color: rgba(71, 85, 105, 0.9) !important;
    color: #e5e7eb !important;
}

html[data-user-theme="dark"] nav a,
html[data-user-theme="dark"] .pwa-category-tab,
html[data-effective-theme="dark"] nav a,
html[data-effective-theme="dark"] .pwa-category-tab {
    background: rgba(15, 23, 42, 0.86) !important;
    border-color: rgba(71, 85, 105, 0.76) !important;
    color: #cbd5e1 !important;
}

html[data-user-theme="dark"] nav a:hover,
html[data-user-theme="dark"] .pwa-category-tab:hover,
html[data-user-theme="dark"] .pwa-category-tab.is-active,
html[data-effective-theme="dark"] nav a:hover,
html[data-effective-theme="dark"] .pwa-category-tab:hover,
html[data-effective-theme="dark"] .pwa-category-tab.is-active {
    background: rgba(37, 99, 235, 0.32) !important;
    border-color: rgba(96, 165, 250, 0.76) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .tw-border-slate-100,
html[data-user-theme="dark"] .tw-border-slate-200,
html[data-user-theme="dark"] .tw-border-gray-100,
html[data-user-theme="dark"] .tw-border-gray-200,
html[data-effective-theme="dark"] .tw-border-slate-100,
html[data-effective-theme="dark"] .tw-border-slate-200,
html[data-effective-theme="dark"] .tw-border-gray-100,
html[data-effective-theme="dark"] .tw-border-gray-200 {
    border-color: rgba(71, 85, 105, 0.76) !important;
}
/* END USER DARK THEME SERVER FALLBACK v2 */

/* DARK THEME CONTRAST FIX v3 */
/* Poprawia czytelność: ciemniejsze tło, jaśniejsze teksty, widoczne marki, numery HZR i karty zamówień. */

html[data-user-theme="dark"] body,
html[data-effective-theme="dark"] body {
    background:
        radial-gradient(circle at 20% 0%, rgba(37, 99, 235, 0.16), transparent 34rem),
        radial-gradient(circle at 80% 20%, rgba(14, 165, 233, 0.10), transparent 30rem),
        linear-gradient(135deg, #020617 0%, #07111f 42%, #0f172a 100%) !important;
    color: #f1f5f9 !important;
}

/* Główne jasne kontenery nie mogą zostawać mleczne */
html[data-user-theme="dark"] .tw-bg-slate-50,
html[data-user-theme="dark"] .tw-bg-gray-50,
html[data-user-theme="dark"] .tw-bg-slate-100,
html[data-user-theme="dark"] .tw-bg-gray-100,
html[data-effective-theme="dark"] .tw-bg-slate-50,
html[data-effective-theme="dark"] .tw-bg-gray-50,
html[data-effective-theme="dark"] .tw-bg-slate-100,
html[data-effective-theme="dark"] .tw-bg-gray-100 {
    background: rgba(15, 23, 42, 0.78) !important;
}

/* Header i górna część strony */
html[data-user-theme="dark"] header,
html[data-effective-theme="dark"] header {
    background:
        linear-gradient(180deg, rgba(2, 6, 23, 0.96), rgba(15, 23, 42, 0.88)) !important;
    border-color: rgba(51, 65, 85, 0.95) !important;
}

html[data-user-theme="dark"] header .tw-text-slate-900,
html[data-user-theme="dark"] header .tw-text-gray-900,
html[data-user-theme="dark"] header .tw-text-slate-800,
html[data-user-theme="dark"] header .tw-text-gray-800,
html[data-effective-theme="dark"] header .tw-text-slate-900,
html[data-effective-theme="dark"] header .tw-text-gray-900,
html[data-effective-theme="dark"] header .tw-text-slate-800,
html[data-effective-theme="dark"] header .tw-text-gray-800 {
    color: #f8fafc !important;
}

html[data-user-theme="dark"] header .tw-text-slate-600,
html[data-user-theme="dark"] header .tw-text-gray-600,
html[data-user-theme="dark"] header .tw-text-slate-500,
html[data-user-theme="dark"] header .tw-text-gray-500,
html[data-effective-theme="dark"] header .tw-text-slate-600,
html[data-effective-theme="dark"] header .tw-text-gray-600,
html[data-effective-theme="dark"] header .tw-text-slate-500,
html[data-effective-theme="dark"] header .tw-text-gray-500 {
    color: #cbd5e1 !important;
}

/* Przełączniki marek/sklepów - wcześniej prawie niewidoczne */
html[data-user-theme="dark"] .brand-switcher,
html[data-user-theme="dark"] .brand-tab,
html[data-user-theme="dark"] .brand-pill,
html[data-user-theme="dark"] a[href*="brand"],
html[data-effective-theme="dark"] .brand-switcher,
html[data-effective-theme="dark"] .brand-tab,
html[data-effective-theme="dark"] .brand-pill,
html[data-effective-theme="dark"] a[href*="brand"] {
    background: rgba(15, 23, 42, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.95) !important;
    color: #e2e8f0 !important;
}

/* Bardziej ogólny selektor dla górnych przełączników marek w base.html */
html[data-user-theme="dark"] header a,
html[data-user-theme="dark"] header button,
html[data-user-theme="dark"] header summary,
html[data-effective-theme="dark"] header a,
html[data-effective-theme="dark"] header button,
html[data-effective-theme="dark"] header summary {
    color: #e2e8f0 !important;
}

html[data-user-theme="dark"] header a:hover,
html[data-user-theme="dark"] header button:hover,
html[data-effective-theme="dark"] header a:hover,
html[data-effective-theme="dark"] header button:hover {
    color: #ffffff !important;
}

/* Paski/kapsułki marek w górnym rzędzie */
html[data-user-theme="dark"] header .tw-rounded-full,
html[data-user-theme="dark"] header .tw-rounded-2xl,
html[data-user-theme="dark"] header .tw-rounded-3xl,
html[data-effective-theme="dark"] header .tw-rounded-full,
html[data-effective-theme="dark"] header .tw-rounded-2xl,
html[data-effective-theme="dark"] header .tw-rounded-3xl {
    border-color: rgba(71, 85, 105, 0.9) !important;
}

/* Nawigacja */
html[data-user-theme="dark"] nav,
html[data-effective-theme="dark"] nav {
    background: rgba(15, 23, 42, 0.72) !important;
    border-color: rgba(71, 85, 105, 0.95) !important;
}

html[data-user-theme="dark"] nav a,
html[data-user-theme="dark"] .pwa-category-tab,
html[data-effective-theme="dark"] nav a,
html[data-effective-theme="dark"] .pwa-category-tab {
    background: rgba(30, 41, 59, 0.98) !important;
    border-color: rgba(71, 85, 105, 0.95) !important;
    color: #e2e8f0 !important;
}

html[data-user-theme="dark"] nav a[aria-current="page"],
html[data-user-theme="dark"] nav a.active,
html[data-user-theme="dark"] .pwa-category-tab.is-active,
html[data-effective-theme="dark"] nav a[aria-current="page"],
html[data-effective-theme="dark"] nav a.active,
html[data-effective-theme="dark"] .pwa-category-tab.is-active {
    background: linear-gradient(135deg, #1e3a8a, #2563eb) !important;
    border-color: rgba(147, 197, 253, 0.92) !important;
    color: #ffffff !important;
}

/* Obszar pracy */
html[data-user-theme="dark"] .work-area,
html[data-user-theme="dark"] .current-area,
html[data-user-theme="dark"] .active-brand-banner,
html[data-effective-theme="dark"] .work-area,
html[data-effective-theme="dark"] .current-area,
html[data-effective-theme="dark"] .active-brand-banner {
    background: rgba(15, 23, 42, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.95) !important;
    color: #e5e7eb !important;
}

/* Ogólne karty i panele */
html[data-user-theme="dark"] .settings-card,
html[data-user-theme="dark"] .cycle-card,
html[data-user-theme="dark"] .dashboard-card,
html[data-user-theme="dark"] .order-card,
html[data-user-theme="dark"] .handoff-card,
html[data-user-theme="dark"] .planner-card,
html[data-user-theme="dark"] .calendar-card,
html[data-user-theme="dark"] .card,
html[data-user-theme="dark"] article,
html[data-effective-theme="dark"] .settings-card,
html[data-effective-theme="dark"] .cycle-card,
html[data-effective-theme="dark"] .dashboard-card,
html[data-effective-theme="dark"] .order-card,
html[data-effective-theme="dark"] .handoff-card,
html[data-effective-theme="dark"] .planner-card,
html[data-effective-theme="dark"] .calendar-card,
html[data-effective-theme="dark"] .card,
html[data-effective-theme="dark"] article {
    background: rgba(15, 23, 42, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.88) !important;
    color: #f1f5f9 !important;
}

/* Karty zamówień/listy - mocniejszy kontrast */
html[data-user-theme="dark"] .order-list-item,
html[data-user-theme="dark"] .order-row,
html[data-user-theme="dark"] .order-tile,
html[data-user-theme="dark"] .order-card,
html[data-effective-theme="dark"] .order-list-item,
html[data-effective-theme="dark"] .order-row,
html[data-effective-theme="dark"] .order-tile,
html[data-effective-theme="dark"] .order-card {
    background: rgba(30, 41, 59, 0.98) !important;
    border-color: rgba(96, 165, 250, 0.34) !important;
    color: #f8fafc !important;
}

/* Numery zamówień, np. HZR-2026-000633 */
html[data-user-theme="dark"] [class*="order"] a,
html[data-user-theme="dark"] [class*="order"] strong,
html[data-user-theme="dark"] [class*="order"] h2,
html[data-user-theme="dark"] [class*="order"] h3,
html[data-user-theme="dark"] [class*="order"] h4,
html[data-effective-theme="dark"] [class*="order"] a,
html[data-effective-theme="dark"] [class*="order"] strong,
html[data-effective-theme="dark"] [class*="order"] h2,
html[data-effective-theme="dark"] [class*="order"] h3,
html[data-effective-theme="dark"] [class*="order"] h4 {
    color: #ffffff !important;
}

/* Bardziej celowany fallback dla tekstów typu HZR, Shopify, klient, produkt */
html[data-user-theme="dark"] a[href*="/zamowienia/"],
html[data-user-theme="dark"] a[href*="order"],
html[data-user-theme="dark"] .order-number,
html[data-user-theme="dark"] .external-number,
html[data-user-theme="dark"] .shopify-number,
html[data-effective-theme="dark"] a[href*="/zamowienia/"],
html[data-effective-theme="dark"] a[href*="order"],
html[data-effective-theme="dark"] .order-number,
html[data-effective-theme="dark"] .external-number,
html[data-effective-theme="dark"] .shopify-number {
    color: #ffffff !important;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25) !important;
}

/* Teksty pomocnicze, etykiety i opisy */
html[data-user-theme="dark"] .tw-text-slate-900,
html[data-user-theme="dark"] .tw-text-gray-900,
html[data-user-theme="dark"] .tw-text-slate-800,
html[data-user-theme="dark"] .tw-text-gray-800,
html[data-user-theme="dark"] .tw-text-slate-700,
html[data-user-theme="dark"] .tw-text-gray-700,
html[data-effective-theme="dark"] .tw-text-slate-900,
html[data-effective-theme="dark"] .tw-text-gray-900,
html[data-effective-theme="dark"] .tw-text-slate-800,
html[data-effective-theme="dark"] .tw-text-gray-800,
html[data-effective-theme="dark"] .tw-text-slate-700,
html[data-effective-theme="dark"] .tw-text-gray-700 {
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .tw-text-slate-600,
html[data-user-theme="dark"] .tw-text-gray-600,
html[data-user-theme="dark"] .tw-text-slate-500,
html[data-user-theme="dark"] .tw-text-gray-500,
html[data-effective-theme="dark"] .tw-text-slate-600,
html[data-effective-theme="dark"] .tw-text-gray-600,
html[data-effective-theme="dark"] .tw-text-slate-500,
html[data-effective-theme="dark"] .tw-text-gray-500 {
    color: #cbd5e1 !important;
}

html[data-user-theme="dark"] .tw-text-slate-400,
html[data-user-theme="dark"] .tw-text-gray-400,
html[data-effective-theme="dark"] .tw-text-slate-400,
html[data-effective-theme="dark"] .tw-text-gray-400 {
    color: #94a3b8 !important;
}

/* Kapsułki statusów i badge */
html[data-user-theme="dark"] .badge,
html[data-user-theme="dark"] .status-pill,
html[data-user-theme="dark"] .tag-pill,
html[data-user-theme="dark"] .tw-rounded-full,
html[data-effective-theme="dark"] .badge,
html[data-effective-theme="dark"] .status-pill,
html[data-effective-theme="dark"] .tag-pill,
html[data-effective-theme="dark"] .tw-rounded-full {
    color: #f8fafc;
}

/* Inputy i selecty */
html[data-user-theme="dark"] input,
html[data-user-theme="dark"] select,
html[data-user-theme="dark"] textarea,
html[data-user-theme="dark"] .form-control,
html[data-user-theme="dark"] .form-select,
html[data-effective-theme="dark"] input,
html[data-effective-theme="dark"] select,
html[data-effective-theme="dark"] textarea,
html[data-effective-theme="dark"] .form-control,
html[data-effective-theme="dark"] .form-select {
    background: #0f172a !important;
    border-color: rgba(100, 116, 139, 0.9) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] input::placeholder,
html[data-user-theme="dark"] textarea::placeholder,
html[data-effective-theme="dark"] input::placeholder,
html[data-effective-theme="dark"] textarea::placeholder {
    color: #94a3b8 !important;
}

/* Białe przyciski w ciemnym motywie - dalej czytelne */
html[data-user-theme="dark"] .tw-bg-white button,
html[data-user-theme="dark"] button.tw-bg-white,
html[data-user-theme="dark"] a.tw-bg-white,
html[data-effective-theme="dark"] .tw-bg-white button,
html[data-effective-theme="dark"] button.tw-bg-white,
html[data-effective-theme="dark"] a.tw-bg-white {
    background: #f8fafc !important;
    color: #020617 !important;
    border-color: rgba(226, 232, 240, 0.95) !important;
}

/* Linki */
html[data-user-theme="dark"] a,
html[data-effective-theme="dark"] a {
    color: #93c5fd;
}

html[data-user-theme="dark"] a:hover,
html[data-effective-theme="dark"] a:hover {
    color: #bfdbfe;
}

/* Górne kafelki statystyk na dashboardzie */
html[data-user-theme="dark"] .dashboard-stat-card,
html[data-user-theme="dark"] .stat-card,
html[data-effective-theme="dark"] .dashboard-stat-card,
html[data-effective-theme="dark"] .stat-card {
    background: rgba(15, 23, 42, 0.96) !important;
    border-color: rgba(71, 85, 105, 0.9) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .dashboard-stat-card *,
html[data-user-theme="dark"] .stat-card *,
html[data-effective-theme="dark"] .dashboard-stat-card *,
html[data-effective-theme="dark"] .stat-card * {
    color: inherit;
}

/* END DARK THEME CONTRAST FIX v3 */

/* DARK THEME STANDARDIZATION v4 */
/*
    Standard:
    - page bg: very dark navy
    - main surfaces: #111827 / #172033
    - elevated surfaces: #1f2937
    - primary text: #f8fafc
    - secondary text: #cbd5e1
    - muted text: #94a3b8
    - light chips/cards kept readable with dark text
*/

html[data-user-theme="dark"],
html[data-effective-theme="dark"] {
    color-scheme: dark;
    --dark-page: #070b16;
    --dark-header: #0b1120;
    --dark-panel: #111827;
    --dark-panel-2: #172033;
    --dark-panel-3: #1f2937;
    --dark-border: rgba(100, 116, 139, 0.58);
    --dark-border-strong: rgba(148, 163, 184, 0.78);
    --dark-text: #f8fafc;
    --dark-text-soft: #e2e8f0;
    --dark-muted: #cbd5e1;
    --dark-muted-2: #94a3b8;
    --dark-blue: #2563eb;
    --dark-blue-soft: rgba(37, 99, 235, 0.24);
    --dark-light-chip: #f8fafc;
    --dark-light-chip-text: #0f172a;
}

html[data-user-theme="dark"] body,
html[data-effective-theme="dark"] body {
    background:
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, 0.13), transparent 30rem),
        radial-gradient(circle at 88% 8%, rgba(14, 165, 233, 0.09), transparent 28rem),
        linear-gradient(135deg, var(--dark-page) 0%, #0b1120 45%, #0f172a 100%) !important;
    color: var(--dark-text) !important;
}

/* Base layout */
html[data-user-theme="dark"] header,
html[data-effective-theme="dark"] header {
    background:
        linear-gradient(180deg, rgba(7, 11, 22, 0.98), rgba(15, 23, 42, 0.96)) !important;
    border-color: rgba(71, 85, 105, 0.85) !important;
    color: var(--dark-text) !important;
}

html[data-user-theme="dark"] main,
html[data-effective-theme="dark"] main {
    background: transparent !important;
    color: var(--dark-text) !important;
}

/* Universal white/light backgrounds inside dark mode */
html[data-user-theme="dark"] .tw-bg-white,
html[data-user-theme="dark"] .tw-bg-white\/90,
html[data-user-theme="dark"] .tw-bg-white\/95,
html[data-user-theme="dark"] .tw-bg-slate-50,
html[data-user-theme="dark"] .tw-bg-slate-100,
html[data-user-theme="dark"] .tw-bg-gray-50,
html[data-user-theme="dark"] .tw-bg-gray-100,
html[data-user-theme="dark"] .bg-white,
html[data-user-theme="dark"] .bg-light,
html[data-effective-theme="dark"] .tw-bg-white,
html[data-effective-theme="dark"] .tw-bg-white\/90,
html[data-effective-theme="dark"] .tw-bg-white\/95,
html[data-effective-theme="dark"] .tw-bg-slate-50,
html[data-effective-theme="dark"] .tw-bg-slate-100,
html[data-effective-theme="dark"] .tw-bg-gray-50,
html[data-effective-theme="dark"] .tw-bg-gray-100,
html[data-effective-theme="dark"] .bg-white,
html[data-effective-theme="dark"] .bg-light {
    background: var(--dark-panel) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
}

/* Common dark surfaces */
html[data-user-theme="dark"] .settings-card,
html[data-user-theme="dark"] .cycle-card,
html[data-user-theme="dark"] .dashboard-card,
html[data-user-theme="dark"] .dashboard-stat-card,
html[data-user-theme="dark"] .stat-card,
html[data-user-theme="dark"] .order-card,
html[data-user-theme="dark"] .handoff-card,
html[data-user-theme="dark"] .planner-card,
html[data-user-theme="dark"] .calendar-card,
html[data-user-theme="dark"] .card,
html[data-user-theme="dark"] .modal-content,
html[data-user-theme="dark"] .dropdown-menu,
html[data-user-theme="dark"] .list-group-item,
html[data-effective-theme="dark"] .settings-card,
html[data-effective-theme="dark"] .cycle-card,
html[data-effective-theme="dark"] .dashboard-card,
html[data-effective-theme="dark"] .dashboard-stat-card,
html[data-effective-theme="dark"] .stat-card,
html[data-effective-theme="dark"] .order-card,
html[data-effective-theme="dark"] .handoff-card,
html[data-effective-theme="dark"] .planner-card,
html[data-effective-theme="dark"] .calendar-card,
html[data-effective-theme="dark"] .card,
html[data-effective-theme="dark"] .modal-content,
html[data-effective-theme="dark"] .dropdown-menu,
html[data-effective-theme="dark"] .list-group-item {
    background: var(--dark-panel-2) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34) !important;
}

/* Text color reset */
html[data-user-theme="dark"] .tw-text-slate-950,
html[data-user-theme="dark"] .tw-text-gray-950,
html[data-user-theme="dark"] .tw-text-slate-900,
html[data-user-theme="dark"] .tw-text-gray-900,
html[data-user-theme="dark"] .tw-text-slate-800,
html[data-user-theme="dark"] .tw-text-gray-800,
html[data-user-theme="dark"] .tw-text-slate-700,
html[data-user-theme="dark"] .tw-text-gray-700,
html[data-effective-theme="dark"] .tw-text-slate-950,
html[data-effective-theme="dark"] .tw-text-gray-950,
html[data-effective-theme="dark"] .tw-text-slate-900,
html[data-effective-theme="dark"] .tw-text-gray-900,
html[data-effective-theme="dark"] .tw-text-slate-800,
html[data-effective-theme="dark"] .tw-text-gray-800,
html[data-effective-theme="dark"] .tw-text-slate-700,
html[data-effective-theme="dark"] .tw-text-gray-700 {
    color: var(--dark-text) !important;
}

html[data-user-theme="dark"] .tw-text-slate-600,
html[data-user-theme="dark"] .tw-text-gray-600,
html[data-user-theme="dark"] .tw-text-slate-500,
html[data-user-theme="dark"] .tw-text-gray-500,
html[data-effective-theme="dark"] .tw-text-slate-600,
html[data-effective-theme="dark"] .tw-text-gray-600,
html[data-effective-theme="dark"] .tw-text-slate-500,
html[data-effective-theme="dark"] .tw-text-gray-500 {
    color: var(--dark-muted) !important;
}

html[data-user-theme="dark"] .tw-text-slate-400,
html[data-user-theme="dark"] .tw-text-gray-400,
html[data-effective-theme="dark"] .tw-text-slate-400,
html[data-effective-theme="dark"] .tw-text-gray-400 {
    color: var(--dark-muted-2) !important;
}

html[data-user-theme="dark"] h1,
html[data-user-theme="dark"] h2,
html[data-user-theme="dark"] h3,
html[data-user-theme="dark"] h4,
html[data-user-theme="dark"] h5,
html[data-user-theme="dark"] h6,
html[data-effective-theme="dark"] h1,
html[data-effective-theme="dark"] h2,
html[data-effective-theme="dark"] h3,
html[data-effective-theme="dark"] h4,
html[data-effective-theme="dark"] h5,
html[data-effective-theme="dark"] h6 {
    color: var(--dark-text) !important;
}

/* Header brand name */
html[data-user-theme="dark"] header strong,
html[data-user-theme="dark"] header .tw-font-black,
html[data-effective-theme="dark"] header strong,
html[data-effective-theme="dark"] header .tw-font-black {
    color: var(--dark-text) !important;
}

/* Brand/shop switcher row - force visible */
html[data-user-theme="dark"] header a[href*="brand"],
html[data-user-theme="dark"] header a[href*="marka"],
html[data-user-theme="dark"] header a[href*="sklep"],
html[data-user-theme="dark"] header form button,
html[data-user-theme="dark"] header .brand-switcher,
html[data-user-theme="dark"] header .brand-tab,
html[data-user-theme="dark"] header .brand-pill,
html[data-effective-theme="dark"] header a[href*="brand"],
html[data-effective-theme="dark"] header a[href*="marka"],
html[data-effective-theme="dark"] header a[href*="sklep"],
html[data-effective-theme="dark"] header form button,
html[data-effective-theme="dark"] header .brand-switcher,
html[data-effective-theme="dark"] header .brand-tab,
html[data-effective-theme="dark"] header .brand-pill {
    background: rgba(30, 41, 59, 0.98) !important;
    border: 1px solid var(--dark-border-strong) !important;
    color: var(--dark-text-soft) !important;
    box-shadow: none !important;
}

/* Extra fallback: first brand row in header usually uses rounded pills */
html[data-user-theme="dark"] header .tw-grid a,
html[data-user-theme="dark"] header .tw-grid button,
html[data-effective-theme="dark"] header .tw-grid a,
html[data-effective-theme="dark"] header .tw-grid button {
    background: rgba(30, 41, 59, 0.98) !important;
    border-color: var(--dark-border-strong) !important;
    color: var(--dark-text-soft) !important;
}

html[data-user-theme="dark"] header .tw-grid a *,
html[data-user-theme="dark"] header .tw-grid button *,
html[data-effective-theme="dark"] header .tw-grid a *,
html[data-effective-theme="dark"] header .tw-grid button * {
    color: var(--dark-text-soft) !important;
}

/* Navigation */
html[data-user-theme="dark"] nav,
html[data-effective-theme="dark"] nav {
    background: rgba(15, 23, 42, 0.86) !important;
    border-color: var(--dark-border-strong) !important;
}

html[data-user-theme="dark"] nav a,
html[data-user-theme="dark"] .pwa-category-tab,
html[data-effective-theme="dark"] nav a,
html[data-effective-theme="dark"] .pwa-category-tab {
    background: rgba(30, 41, 59, 0.98) !important;
    border-color: var(--dark-border-strong) !important;
    color: var(--dark-text-soft) !important;
}

html[data-user-theme="dark"] nav a *,
html[data-user-theme="dark"] .pwa-category-tab *,
html[data-effective-theme="dark"] nav a *,
html[data-effective-theme="dark"] .pwa-category-tab * {
    color: inherit !important;
}

html[data-user-theme="dark"] nav a[aria-current="page"],
html[data-user-theme="dark"] nav a.active,
html[data-user-theme="dark"] .pwa-category-tab.is-active,
html[data-effective-theme="dark"] nav a[aria-current="page"],
html[data-effective-theme="dark"] nav a.active,
html[data-effective-theme="dark"] .pwa-category-tab.is-active {
    background: linear-gradient(135deg, #1d4ed8, #2563eb) !important;
    border-color: #93c5fd !important;
    color: #ffffff !important;
}

/* Work area/current area banners */
html[data-user-theme="dark"] .work-area,
html[data-user-theme="dark"] .current-area,
html[data-user-theme="dark"] .active-brand-banner,
html[data-effective-theme="dark"] .work-area,
html[data-effective-theme="dark"] .current-area,
html[data-effective-theme="dark"] .active-brand-banner {
    background: var(--dark-panel-2) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
}

/* Order list cards */
html[data-user-theme="dark"] .order-list-item,
html[data-user-theme="dark"] .order-row,
html[data-user-theme="dark"] .order-tile,
html[data-user-theme="dark"] .order-card,
html[data-effective-theme="dark"] .order-list-item,
html[data-effective-theme="dark"] .order-row,
html[data-effective-theme="dark"] .order-tile,
html[data-effective-theme="dark"] .order-card {
    background: var(--dark-panel-2) !important;
    border-color: rgba(96, 165, 250, 0.38) !important;
    color: var(--dark-text) !important;
}

/* Order numbers / HZR / Shopify numbers */
html[data-user-theme="dark"] .order-number,
html[data-user-theme="dark"] .external-number,
html[data-user-theme="dark"] .shopify-number,
html[data-user-theme="dark"] a[href*="/zamowienia/"],
html[data-user-theme="dark"] a[href*="/orders/"],
html[data-effective-theme="dark"] .order-number,
html[data-effective-theme="dark"] .external-number,
html[data-effective-theme="dark"] .shopify-number,
html[data-effective-theme="dark"] a[href*="/zamowienia/"],
html[data-effective-theme="dark"] a[href*="/orders/"] {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Fallback for HZR text inside dark order cards */
html[data-user-theme="dark"] [class*="order"] strong,
html[data-user-theme="dark"] [class*="order"] b,
html[data-user-theme="dark"] [class*="order"] h1,
html[data-user-theme="dark"] [class*="order"] h2,
html[data-user-theme="dark"] [class*="order"] h3,
html[data-user-theme="dark"] [class*="order"] h4,
html[data-effective-theme="dark"] [class*="order"] strong,
html[data-effective-theme="dark"] [class*="order"] b,
html[data-effective-theme="dark"] [class*="order"] h1,
html[data-effective-theme="dark"] [class*="order"] h2,
html[data-effective-theme="dark"] [class*="order"] h3,
html[data-effective-theme="dark"] [class*="order"] h4 {
    color: #ffffff !important;
}

/* Forms */
html[data-user-theme="dark"] input,
html[data-user-theme="dark"] select,
html[data-user-theme="dark"] textarea,
html[data-user-theme="dark"] .form-control,
html[data-user-theme="dark"] .form-select,
html[data-effective-theme="dark"] input,
html[data-effective-theme="dark"] select,
html[data-effective-theme="dark"] textarea,
html[data-effective-theme="dark"] .form-control,
html[data-effective-theme="dark"] .form-select {
    background: #0b1220 !important;
    border-color: var(--dark-border-strong) !important;
    color: var(--dark-text) !important;
}

html[data-user-theme="dark"] input::placeholder,
html[data-user-theme="dark"] textarea::placeholder,
html[data-effective-theme="dark"] input::placeholder,
html[data-effective-theme="dark"] textarea::placeholder {
    color: #cbd5e1 !important;
    opacity: 0.82 !important;
}

/* Light buttons/cards that should stay light must use dark text */
html[data-user-theme="dark"] a.tw-bg-white,
html[data-user-theme="dark"] button.tw-bg-white,
html[data-user-theme="dark"] .tw-bg-white a,
html[data-user-theme="dark"] .tw-bg-white button,
html[data-user-theme="dark"] a.tw-bg-slate-50,
html[data-user-theme="dark"] button.tw-bg-slate-50,
html[data-effective-theme="dark"] a.tw-bg-white,
html[data-effective-theme="dark"] button.tw-bg-white,
html[data-effective-theme="dark"] .tw-bg-white a,
html[data-effective-theme="dark"] .tw-bg-white button,
html[data-effective-theme="dark"] a.tw-bg-slate-50,
html[data-effective-theme="dark"] button.tw-bg-slate-50 {
    background: var(--dark-light-chip) !important;
    color: var(--dark-light-chip-text) !important;
    border-color: rgba(226, 232, 240, 0.96) !important;
}

html[data-user-theme="dark"] a.tw-bg-white *,
html[data-user-theme="dark"] button.tw-bg-white *,
html[data-user-theme="dark"] .tw-bg-white a *,
html[data-user-theme="dark"] .tw-bg-white button *,
html[data-user-theme="dark"] a.tw-bg-slate-50 *,
html[data-user-theme="dark"] button.tw-bg-slate-50 *,
html[data-effective-theme="dark"] a.tw-bg-white *,
html[data-effective-theme="dark"] button.tw-bg-white *,
html[data-effective-theme="dark"] .tw-bg-white a *,
html[data-effective-theme="dark"] .tw-bg-white button *,
html[data-effective-theme="dark"] a.tw-bg-slate-50 *,
html[data-effective-theme="dark"] button.tw-bg-slate-50 * {
    color: var(--dark-light-chip-text) !important;
}

/* Generic white pills/badges on dark cards */
html[data-user-theme="dark"] .badge,
html[data-user-theme="dark"] .status-pill,
html[data-user-theme="dark"] .tag-pill,
html[data-effective-theme="dark"] .badge,
html[data-effective-theme="dark"] .status-pill,
html[data-effective-theme="dark"] .tag-pill {
    color: inherit;
}

/* If a badge/chip is visually light, make text dark */
html[data-user-theme="dark"] .tw-bg-blue-50,
html[data-user-theme="dark"] .tw-bg-green-50,
html[data-user-theme="dark"] .tw-bg-red-50,
html[data-user-theme="dark"] .tw-bg-yellow-50,
html[data-user-theme="dark"] .tw-bg-emerald-50,
html[data-user-theme="dark"] .tw-bg-indigo-50,
html[data-user-theme="dark"] .tw-bg-sky-50,
html[data-effective-theme="dark"] .tw-bg-blue-50,
html[data-effective-theme="dark"] .tw-bg-green-50,
html[data-effective-theme="dark"] .tw-bg-red-50,
html[data-effective-theme="dark"] .tw-bg-yellow-50,
html[data-effective-theme="dark"] .tw-bg-emerald-50,
html[data-effective-theme="dark"] .tw-bg-indigo-50,
html[data-effective-theme="dark"] .tw-bg-sky-50 {
    color: #0f172a !important;
}

/* Tables - especially personalized cycle table */
html[data-user-theme="dark"] table,
html[data-user-theme="dark"] .table,
html[data-effective-theme="dark"] table,
html[data-effective-theme="dark"] .table {
    background: var(--dark-panel) !important;
    color: var(--dark-text) !important;
}

html[data-user-theme="dark"] thead,
html[data-user-theme="dark"] thead tr,
html[data-user-theme="dark"] thead th,
html[data-effective-theme="dark"] thead,
html[data-effective-theme="dark"] thead tr,
html[data-effective-theme="dark"] thead th {
    background: #0b1220 !important;
    color: var(--dark-muted) !important;
    border-color: var(--dark-border) !important;
}

html[data-user-theme="dark"] tbody,
html[data-user-theme="dark"] tbody tr,
html[data-user-theme="dark"] tbody td,
html[data-effective-theme="dark"] tbody,
html[data-effective-theme="dark"] tbody tr,
html[data-effective-theme="dark"] tbody td {
    background: var(--dark-panel-2) !important;
    color: var(--dark-text-soft) !important;
    border-color: var(--dark-border) !important;
}

html[data-user-theme="dark"] tbody tr:hover,
html[data-effective-theme="dark"] tbody tr:hover {
    background: var(--dark-panel-3) !important;
}

html[data-user-theme="dark"] tbody td *,
html[data-effective-theme="dark"] tbody td * {
    color: inherit;
}

/* Cycle table/order numbers inside td */
html[data-user-theme="dark"] tbody td strong,
html[data-user-theme="dark"] tbody td b,
html[data-user-theme="dark"] tbody td a,
html[data-effective-theme="dark"] tbody td strong,
html[data-effective-theme="dark"] tbody td b,
html[data-effective-theme="dark"] tbody td a {
    color: #ffffff !important;
}

/* Calendar */
html[data-user-theme="dark"] .calendar-day,
html[data-user-theme="dark"] .calendar-cell,
html[data-user-theme="dark"] .calendar-card,
html[data-effective-theme="dark"] .calendar-day,
html[data-effective-theme="dark"] .calendar-cell,
html[data-effective-theme="dark"] .calendar-card {
    background: var(--dark-panel-2) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
}

/* Light calendar day tiles should not have washed-out text */
html[data-user-theme="dark"] .calendar-day *,
html[data-user-theme="dark"] .calendar-cell *,
html[data-effective-theme="dark"] .calendar-day *,
html[data-effective-theme="dark"] .calendar-cell * {
    color: inherit !important;
}

html[data-user-theme="dark"] .calendar-sidebar,
html[data-user-theme="dark"] .selected-day-panel,
html[data-effective-theme="dark"] .calendar-sidebar,
html[data-effective-theme="dark"] .selected-day-panel {
    background: var(--dark-panel) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
}

/* Notes */
html[data-user-theme="dark"] .note-card,
html[data-user-theme="dark"] .sticky-note,
html[data-effective-theme="dark"] .note-card,
html[data-effective-theme="dark"] .sticky-note {
    background: #172033 !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
}

/* Sticky note yellow variant: keep yellow but make text dark */
html[data-user-theme="dark"] .sticky-note[style*="yellow"],
html[data-user-theme="dark"] .note-card[style*="yellow"],
html[data-effective-theme="dark"] .sticky-note[style*="yellow"],
html[data-effective-theme="dark"] .note-card[style*="yellow"] {
    color: #111827 !important;
}

/* Progress bars / pale strips */
html[data-user-theme="dark"] .progress,
html[data-user-theme="dark"] .progress-bar-wrapper,
html[data-effective-theme="dark"] .progress,
html[data-effective-theme="dark"] .progress-bar-wrapper {
    background: rgba(51, 65, 85, 0.78) !important;
}

/* Links */
html[data-user-theme="dark"] a,
html[data-effective-theme="dark"] a {
    color: #93c5fd;
}

html[data-user-theme="dark"] a:hover,
html[data-effective-theme="dark"] a:hover {
    color: #bfdbfe;
}

/* Danger/delete buttons keep readable */
html[data-user-theme="dark"] .tw-text-red-700,
html[data-user-theme="dark"] .tw-text-red-600,
html[data-effective-theme="dark"] .tw-text-red-700,
html[data-effective-theme="dark"] .tw-text-red-600 {
    color: #fca5a5 !important;
}

/* END DARK THEME STANDARDIZATION v4 */

/* DARK THEME TARGETED CONTRAST FIX v5 */
/* Deadline cards, calendar order list, dashboard lists/actions */

/* 1. Deadline cards on order list/dashboard */
html[data-user-theme="dark"] .deadline-card,
html[data-user-theme="dark"] .deadline-box,
html[data-user-theme="dark"] .deadline-pill,
html[data-user-theme="dark"] [class*="deadline"],
html[data-effective-theme="dark"] .deadline-card,
html[data-effective-theme="dark"] .deadline-box,
html[data-effective-theme="dark"] .deadline-pill,
html[data-effective-theme="dark"] [class*="deadline"] {
    background: rgba(15, 23, 42, 0.94) !important;
    border-color: rgba(100, 116, 139, 0.78) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] [class*="deadline"] *,
html[data-effective-theme="dark"] [class*="deadline"] * {
    color: #e2e8f0 !important;
}

html[data-user-theme="dark"] [class*="deadline"] .tw-text-red-500,
html[data-user-theme="dark"] [class*="deadline"] .tw-text-red-600,
html[data-user-theme="dark"] [class*="deadline"] .tw-text-red-700,
html[data-effective-theme="dark"] [class*="deadline"] .tw-text-red-500,
html[data-effective-theme="dark"] [class*="deadline"] .tw-text-red-600,
html[data-effective-theme="dark"] [class*="deadline"] .tw-text-red-700 {
    color: #f87171 !important;
}

/* If deadline is a light internal card inside an order row */
html[data-user-theme="dark"] .order-card [class*="deadline"],
html[data-user-theme="dark"] .order-list-item [class*="deadline"],
html[data-user-theme="dark"] .order-row [class*="deadline"],
html[data-effective-theme="dark"] .order-card [class*="deadline"],
html[data-effective-theme="dark"] .order-list-item [class*="deadline"],
html[data-effective-theme="dark"] .order-row [class*="deadline"] {
    background: #0f172a !important;
    color: #f8fafc !important;
    box-shadow: inset 0 0 0 1px rgba(100, 116, 139, 0.55) !important;
}

/* 2. Calendar day cells */
html[data-user-theme="dark"] .calendar-day,
html[data-user-theme="dark"] .calendar-cell,
html[data-user-theme="dark"] [class*="calendar"] .day,
html[data-effective-theme="dark"] .calendar-day,
html[data-effective-theme="dark"] .calendar-cell,
html[data-effective-theme="dark"] [class*="calendar"] .day {
    background: #111827 !important;
    border-color: rgba(100, 116, 139, 0.7) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .calendar-day *,
html[data-user-theme="dark"] .calendar-cell *,
html[data-effective-theme="dark"] .calendar-day *,
html[data-effective-theme="dark"] .calendar-cell * {
    color: inherit !important;
}

/* 3. Calendar selected-day order cards */
html[data-user-theme="dark"] .selected-day-panel,
html[data-user-theme="dark"] .calendar-sidebar,
html[data-user-theme="dark"] [class*="selected-day"],
html[data-effective-theme="dark"] .selected-day-panel,
html[data-effective-theme="dark"] .calendar-sidebar,
html[data-effective-theme="dark"] [class*="selected-day"] {
    background: #111827 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .selected-day-panel .order-card,
html[data-user-theme="dark"] .calendar-sidebar .order-card,
html[data-user-theme="dark"] .selected-day-panel a,
html[data-user-theme="dark"] .calendar-sidebar a,
html[data-user-theme="dark"] [class*="selected-day"] .order-card,
html[data-user-theme="dark"] [class*="selected-day"] a,
html[data-effective-theme="dark"] .selected-day-panel .order-card,
html[data-effective-theme="dark"] .calendar-sidebar .order-card,
html[data-effective-theme="dark"] .selected-day-panel a,
html[data-effective-theme="dark"] .calendar-sidebar a,
html[data-effective-theme="dark"] [class*="selected-day"] .order-card,
html[data-effective-theme="dark"] [class*="selected-day"] a {
    background: #1f2937 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .selected-day-panel .order-card *,
html[data-user-theme="dark"] .calendar-sidebar .order-card *,
html[data-user-theme="dark"] [class*="selected-day"] .order-card *,
html[data-effective-theme="dark"] .selected-day-panel .order-card *,
html[data-effective-theme="dark"] .calendar-sidebar .order-card *,
html[data-effective-theme="dark"] [class*="selected-day"] .order-card * {
    color: #e2e8f0 !important;
}

html[data-user-theme="dark"] .selected-day-panel .order-card strong,
html[data-user-theme="dark"] .selected-day-panel .order-card b,
html[data-user-theme="dark"] .calendar-sidebar .order-card strong,
html[data-user-theme="dark"] .calendar-sidebar .order-card b,
html[data-effective-theme="dark"] .selected-day-panel .order-card strong,
html[data-effective-theme="dark"] .selected-day-panel .order-card b,
html[data-effective-theme="dark"] .calendar-sidebar .order-card strong,
html[data-effective-theme="dark"] .calendar-sidebar .order-card b {
    color: #ffffff !important;
}

/* 4. Dashboard queue/list cards */
html[data-user-theme="dark"] .dashboard-queue,
html[data-user-theme="dark"] .dashboard-list,
html[data-user-theme="dark"] .quick-actions,
html[data-user-theme="dark"] .quick-actions-card,
html[data-effective-theme="dark"] .dashboard-queue,
html[data-effective-theme="dark"] .dashboard-list,
html[data-effective-theme="dark"] .quick-actions,
html[data-effective-theme="dark"] .quick-actions-card {
    background: #111827 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .dashboard-queue *,
html[data-user-theme="dark"] .dashboard-list *,
html[data-user-theme="dark"] .quick-actions *,
html[data-user-theme="dark"] .quick-actions-card *,
html[data-effective-theme="dark"] .dashboard-queue *,
html[data-effective-theme="dark"] .dashboard-list *,
html[data-effective-theme="dark"] .quick-actions *,
html[data-effective-theme="dark"] .quick-actions-card * {
    color: inherit;
}

/* Dashboard order rows specifically */
html[data-user-theme="dark"] .dashboard-queue .order-card,
html[data-user-theme="dark"] .dashboard-list .order-card,
html[data-user-theme="dark"] .dashboard-queue [class*="order"],
html[data-user-theme="dark"] .dashboard-list [class*="order"],
html[data-effective-theme="dark"] .dashboard-queue .order-card,
html[data-effective-theme="dark"] .dashboard-list .order-card,
html[data-effective-theme="dark"] .dashboard-queue [class*="order"],
html[data-effective-theme="dark"] .dashboard-list [class*="order"] {
    background: #1f2937 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

/* Dashboard HZR numbers */
html[data-user-theme="dark"] .dashboard-queue [class*="order"] strong,
html[data-user-theme="dark"] .dashboard-queue [class*="order"] b,
html[data-user-theme="dark"] .dashboard-list [class*="order"] strong,
html[data-user-theme="dark"] .dashboard-list [class*="order"] b,
html[data-effective-theme="dark"] .dashboard-queue [class*="order"] strong,
html[data-effective-theme="dark"] .dashboard-queue [class*="order"] b,
html[data-effective-theme="dark"] .dashboard-list [class*="order"] strong,
html[data-effective-theme="dark"] .dashboard-list [class*="order"] b {
    color: #ffffff !important;
}

/* 5. Quick action buttons: keep readable and less washed-out */
html[data-user-theme="dark"] .quick-actions a,
html[data-user-theme="dark"] .quick-actions button,
html[data-user-theme="dark"] .quick-actions-card a,
html[data-user-theme="dark"] .quick-actions-card button,
html[data-effective-theme="dark"] .quick-actions a,
html[data-effective-theme="dark"] .quick-actions button,
html[data-effective-theme="dark"] .quick-actions-card a,
html[data-effective-theme="dark"] .quick-actions-card button {
    background: #1f2937 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .quick-actions a *,
html[data-user-theme="dark"] .quick-actions button *,
html[data-user-theme="dark"] .quick-actions-card a *,
html[data-user-theme="dark"] .quick-actions-card button *,
html[data-effective-theme="dark"] .quick-actions a *,
html[data-effective-theme="dark"] .quick-actions button *,
html[data-effective-theme="dark"] .quick-actions-card a *,
html[data-effective-theme="dark"] .quick-actions-card button * {
    color: inherit !important;
}

html[data-user-theme="dark"] .quick-actions a:hover,
html[data-user-theme="dark"] .quick-actions button:hover,
html[data-user-theme="dark"] .quick-actions-card a:hover,
html[data-user-theme="dark"] .quick-actions-card button:hover,
html[data-effective-theme="dark"] .quick-actions a:hover,
html[data-effective-theme="dark"] .quick-actions button:hover,
html[data-effective-theme="dark"] .quick-actions-card a:hover,
html[data-effective-theme="dark"] .quick-actions-card button:hover {
    background: #2563eb !important;
    border-color: #93c5fd !important;
    color: #ffffff !important;
}

/* 6. Light chips inside dark surfaces - readable */
html[data-user-theme="dark"] .tw-bg-white,
html[data-user-theme="dark"] .tw-bg-slate-50,
html[data-user-theme="dark"] .tw-bg-gray-50,
html[data-effective-theme="dark"] .tw-bg-white,
html[data-effective-theme="dark"] .tw-bg-slate-50,
html[data-effective-theme="dark"] .tw-bg-gray-50 {
    color: #f8fafc !important;
}

/* But explicitly pale badges should have dark text */
html[data-user-theme="dark"] .tw-bg-blue-50,
html[data-user-theme="dark"] .tw-bg-green-50,
html[data-user-theme="dark"] .tw-bg-emerald-50,
html[data-user-theme="dark"] .tw-bg-red-50,
html[data-user-theme="dark"] .tw-bg-yellow-50,
html[data-user-theme="dark"] .tw-bg-orange-50,
html[data-user-theme="dark"] .tw-bg-sky-50,
html[data-effective-theme="dark"] .tw-bg-blue-50,
html[data-effective-theme="dark"] .tw-bg-green-50,
html[data-effective-theme="dark"] .tw-bg-emerald-50,
html[data-effective-theme="dark"] .tw-bg-red-50,
html[data-effective-theme="dark"] .tw-bg-yellow-50,
html[data-effective-theme="dark"] .tw-bg-orange-50,
html[data-effective-theme="dark"] .tw-bg-sky-50 {
    color: #0f172a !important;
}

html[data-user-theme="dark"] .tw-bg-blue-50 *,
html[data-user-theme="dark"] .tw-bg-green-50 *,
html[data-user-theme="dark"] .tw-bg-emerald-50 *,
html[data-user-theme="dark"] .tw-bg-red-50 *,
html[data-user-theme="dark"] .tw-bg-yellow-50 *,
html[data-user-theme="dark"] .tw-bg-orange-50 *,
html[data-user-theme="dark"] .tw-bg-sky-50 *,
html[data-effective-theme="dark"] .tw-bg-blue-50 *,
html[data-effective-theme="dark"] .tw-bg-green-50 *,
html[data-effective-theme="dark"] .tw-bg-emerald-50 *,
html[data-effective-theme="dark"] .tw-bg-red-50 *,
html[data-effective-theme="dark"] .tw-bg-yellow-50 *,
html[data-effective-theme="dark"] .tw-bg-orange-50 *,
html[data-effective-theme="dark"] .tw-bg-sky-50 * {
    color: #0f172a !important;
}

/* 7. White primary buttons on dark hero sections */
html[data-user-theme="dark"] .page-hero a.tw-bg-white,
html[data-user-theme="dark"] .page-hero button.tw-bg-white,
html[data-user-theme="dark"] .dashboard-hero a.tw-bg-white,
html[data-user-theme="dark"] .dashboard-hero button.tw-bg-white,
html[data-effective-theme="dark"] .page-hero a.tw-bg-white,
html[data-effective-theme="dark"] .page-hero button.tw-bg-white,
html[data-effective-theme="dark"] .dashboard-hero a.tw-bg-white,
html[data-effective-theme="dark"] .dashboard-hero button.tw-bg-white {
    background: #f8fafc !important;
    color: #020617 !important;
}

html[data-user-theme="dark"] .page-hero a.tw-bg-white *,
html[data-user-theme="dark"] .page-hero button.tw-bg-white *,
html[data-user-theme="dark"] .dashboard-hero a.tw-bg-white *,
html[data-user-theme="dark"] .dashboard-hero button.tw-bg-white *,
html[data-effective-theme="dark"] .page-hero a.tw-bg-white *,
html[data-effective-theme="dark"] .page-hero button.tw-bg-white *,
html[data-effective-theme="dark"] .dashboard-hero a.tw-bg-white *,
html[data-effective-theme="dark"] .dashboard-hero button.tw-bg-white * {
    color: #020617 !important;
}

/* END DARK THEME TARGETED CONTRAST FIX v5 */

/* DARK THEME SPECIFIC FIX v6 */
/* Celowane poprawki po dodaniu klas semantycznych w order_list.html. */

html[data-user-theme="dark"] .order-list-card-dark,
html[data-effective-theme="dark"] .order-list-card-dark {
    background: #172033 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .order-list-card-dark:hover,
html[data-effective-theme="dark"] .order-list-card-dark:hover {
    background: #1f2937 !important;
    border-color: rgba(96, 165, 250, 0.7) !important;
}

html[data-user-theme="dark"] .order-number-dark,
html[data-effective-theme="dark"] .order-number-dark {
    color: #ffffff !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .order-subnumber-dark,
html[data-effective-theme="dark"] .order-subnumber-dark {
    color: #cbd5e1 !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .order-deadline-card-dark,
html[data-effective-theme="dark"] .order-deadline-card-dark {
    background: #0f172a !important;
    border: 1px solid rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.9) !important;
}

html[data-user-theme="dark"] .order-deadline-card-dark *,
html[data-effective-theme="dark"] .order-deadline-card-dark * {
    color: #e2e8f0 !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .order-deadline-card-dark .tw-text-red-600,
html[data-user-theme="dark"] .order-deadline-card-dark .tw-text-red-500,
html[data-effective-theme="dark"] .order-deadline-card-dark .tw-text-red-600,
html[data-effective-theme="dark"] .order-deadline-card-dark .tw-text-red-500 {
    color: #f87171 !important;
}

html[data-user-theme="dark"] .order-deadline-card-dark .tw-text-amber-600,
html[data-effective-theme="dark"] .order-deadline-card-dark .tw-text-amber-600 {
    color: #fbbf24 !important;
}

/* Kalendarz: jasne karty zamówień po prawej */
html[data-user-theme="dark"] .calendar-card a,
html[data-user-theme="dark"] .calendar-card article,
html[data-user-theme="dark"] .calendar-card .tw-bg-white,
html[data-user-theme="dark"] .calendar-card .tw-bg-slate-50,
html[data-effective-theme="dark"] .calendar-card a,
html[data-effective-theme="dark"] .calendar-card article,
html[data-effective-theme="dark"] .calendar-card .tw-bg-white,
html[data-effective-theme="dark"] .calendar-card .tw-bg-slate-50 {
    background: #1f2937 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .calendar-card a *,
html[data-user-theme="dark"] .calendar-card article *,
html[data-effective-theme="dark"] .calendar-card a *,
html[data-effective-theme="dark"] .calendar-card article * {
    color: #e2e8f0 !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .calendar-card strong,
html[data-user-theme="dark"] .calendar-card b,
html[data-effective-theme="dark"] .calendar-card strong,
html[data-effective-theme="dark"] .calendar-card b {
    color: #ffffff !important;
}

/* Dashboard: listy i szybkie akcje bez wyblakłych jasnych kafli */
html[data-user-theme="dark"] .dashboard-card .tw-bg-white,
html[data-user-theme="dark"] .dashboard-card .tw-bg-slate-50,
html[data-user-theme="dark"] .dashboard-card article,
html[data-user-theme="dark"] .dashboard-card a,
html[data-effective-theme="dark"] .dashboard-card .tw-bg-white,
html[data-effective-theme="dark"] .dashboard-card .tw-bg-slate-50,
html[data-effective-theme="dark"] .dashboard-card article,
html[data-effective-theme="dark"] .dashboard-card a {
    background: #1f2937 !important;
    border-color: rgba(100, 116, 139, 0.72) !important;
    color: #f8fafc !important;
}

html[data-user-theme="dark"] .dashboard-card .tw-bg-white *,
html[data-user-theme="dark"] .dashboard-card .tw-bg-slate-50 *,
html[data-user-theme="dark"] .dashboard-card article *,
html[data-user-theme="dark"] .dashboard-card a *,
html[data-effective-theme="dark"] .dashboard-card .tw-bg-white *,
html[data-effective-theme="dark"] .dashboard-card .tw-bg-slate-50 *,
html[data-effective-theme="dark"] .dashboard-card article *,
html[data-effective-theme="dark"] .dashboard-card a * {
    color: #e2e8f0 !important;
    opacity: 1 !important;
}

html[data-user-theme="dark"] .dashboard-card strong,
html[data-user-theme="dark"] .dashboard-card b,
html[data-effective-theme="dark"] .dashboard-card strong,
html[data-effective-theme="dark"] .dashboard-card b {
    color: #ffffff !important;
}

/* Białe CTA w hero mają zostać jasne, ale z ciemnym tekstem */
html[data-user-theme="dark"] .orders-hero-clean a.ui-btn-primary,
html[data-user-theme="dark"] .orders-hero-clean button.ui-btn-primary,
html[data-effective-theme="dark"] .orders-hero-clean a.ui-btn-primary,
html[data-effective-theme="dark"] .orders-hero-clean button.ui-btn-primary {
    background: #f8fafc !important;
    color: #020617 !important;
}

html[data-user-theme="dark"] .orders-hero-clean a.ui-btn-primary *,
html[data-user-theme="dark"] .orders-hero-clean button.ui-btn-primary *,
html[data-effective-theme="dark"] .orders-hero-clean a.ui-btn-primary *,
html[data-effective-theme="dark"] .orders-hero-clean button.ui-btn-primary * {
    color: #020617 !important;
}

/* END DARK THEME SPECIFIC FIX v6 */

/* DARK THEME DEADLINE FINAL FIX v7 */
/* Deadline ma być ciemny i kontrastowy. Łapiemy go po klasie oraz po pozycji w karcie zamówienia. */

html[data-user-theme="dark"] .orders-card-clean .order-deadline-card-dark,
html[data-effective-theme="dark"] .orders-card-clean .order-deadline-card-dark,
html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2),
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2),
html[data-user-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2),
html[data-effective-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) {
    background: #020617 !important;
    background-color: #020617 !important;
    border: 1px solid rgba(148, 163, 184, 0.72) !important;
    color: #f8fafc !important;
    box-shadow:
        inset 0 0 0 1px rgba(15, 23, 42, 0.95),
        0 10px 28px rgba(0, 0, 0, 0.22) !important;
}

html[data-user-theme="dark"] .orders-card-clean .order-deadline-card-dark *,
html[data-effective-theme="dark"] .orders-card-clean .order-deadline-card-dark *,
html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) *,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) *,
html[data-user-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) *,
html[data-effective-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) * {
    color: #e2e8f0 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) > div:first-child,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) > div:first-child,
html[data-user-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) > div:first-child,
html[data-effective-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) > div:first-child {
    color: #94a3b8 !important;
}

html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-sm,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-sm,
html[data-user-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) .tw-text-sm,
html[data-effective-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) .tw-text-sm {
    color: #ffffff !important;
    font-weight: 1000 !important;
}

html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-xs,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-xs,
html[data-user-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) .tw-text-xs,
html[data-effective-theme="dark"] .order-list-card-dark .tw-grid > div:nth-child(2) .tw-text-xs {
    color: #cbd5e1 !important;
}

/* Kolory wyjątków: po terminie / dzisiaj */
html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-red-600,
html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-red-500,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-red-600,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-red-500 {
    color: #fb7185 !important;
}

html[data-user-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-amber-600,
html[data-effective-theme="dark"] .orders-card-clean .tw-grid > div:nth-child(2) .tw-text-amber-600 {
    color: #fbbf24 !important;
}

/* END DARK THEME DEADLINE FINAL FIX v7 */
