/* =========================================================================
   Fiskio — system wizualny (Bootstrap 5.3 + własny motyw)
   Granatowe i niebieskie akcenty, jasny i ciemny motyw (data-bs-theme).
   Brak zewnętrznych fontów/CDN (RODO, CSP) — stos fontów systemowych.
   ========================================================================= */
:root, [data-bs-theme="light"] {
    --kt-navy: #0B1F3A;
    --kt-navy-2: #12305A;
    --kt-blue: #1D4ED8;
    --kt-blue-2: #3B82F6;
    --kt-blue-soft: #E8EFFE;
    --kt-bg: #F4F6FB;
    --kt-surface: #FFFFFF;
    --kt-border: #E3E8F0;
    --kt-muted: #64748B;
    --kt-text: #0F172A;
    --kt-sidebar-bg: #0B1F3A;
    --kt-sidebar-text: #C7D2E5;
    --kt-sidebar-active: rgba(59, 130, 246, .18);
    --kt-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 16px rgba(15, 23, 42, .05);
    --kt-error: #B91C1C;  --kt-error-soft: #FEE2E2;
    --kt-warn: #B45309;   --kt-warn-soft: #FEF3C7;
    --kt-ok: #15803D;     --kt-ok-soft: #DCFCE7;
    --kt-info: #1D4ED8;   --kt-info-soft: #DBEAFE;
    --kt-skip: #64748B;   --kt-skip-soft: #F1F5F9;
    --bs-body-bg: var(--kt-bg);
    --bs-body-color: var(--kt-text);
    --bs-primary: var(--kt-blue);
    --bs-primary-rgb: 29, 78, 216;
    --bs-link-color: var(--kt-blue);
    --bs-link-color-rgb: 29, 78, 216;
    --bs-link-hover-color: var(--kt-navy-2);
    --bs-border-color: var(--kt-border);
    --bs-font-sans-serif: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

[data-bs-theme="dark"] {
    --kt-bg: #0A1120;
    --kt-surface: #101A2E;
    --kt-border: #1E2B45;
    --kt-muted: #94A3B8;
    --kt-text: #E2E8F0;
    --kt-blue-soft: #15264A;
    --kt-sidebar-bg: #070E1C;
    --kt-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .25);
    --kt-error-soft: #3B1219; --kt-error: #F87171;
    --kt-warn-soft: #3A2A0A;  --kt-warn: #FBBF24;
    --kt-ok-soft: #0C2E1B;    --kt-ok: #4ADE80;
    --kt-info-soft: #13254A;  --kt-info: #60A5FA;
    --kt-skip-soft: #1A2539;
    --bs-body-bg: var(--kt-bg);
    --bs-body-color: var(--kt-text);
    --bs-border-color: var(--kt-border);
    --bs-link-color: #60A5FA;
    --bs-link-color-rgb: 96, 165, 250;
}

html, body { font-family: var(--bs-font-sans-serif); }
body { background: var(--kt-bg); color: var(--kt-text); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5 { font-weight: 650; letter-spacing: -.01em; }
h1:focus { outline: none; }
.text-muted, .text-body-secondary { color: var(--kt-muted) !important; }

/* ---------- Przyciski ---------- */
.btn { border-radius: .55rem; font-weight: 550; }
.btn-primary { --bs-btn-bg: var(--kt-blue); --bs-btn-border-color: var(--kt-blue); --bs-btn-hover-bg: #1E40AF; --bs-btn-hover-border-color: #1E40AF; --bs-btn-active-bg: #1E3A8A; }
.btn-navy { background: var(--kt-navy); color: #fff; border-color: var(--kt-navy); }
.btn-navy:hover { background: var(--kt-navy-2); color: #fff; }
.btn-soft { background: var(--kt-blue-soft); color: var(--kt-blue); border: 0; }
.btn-soft:hover { filter: brightness(.97); color: var(--kt-blue); }
.btn:focus-visible, .form-control:focus, .form-select:focus, .form-check-input:focus { box-shadow: 0 0 0 .2rem rgba(59, 130, 246, .35); border-color: var(--kt-blue-2); }

/* ---------- Karty i powierzchnie ---------- */
.kt-card, .card { background: var(--kt-surface); border: 1px solid var(--kt-border); border-radius: .9rem; box-shadow: var(--kt-shadow); }
.kt-card { padding: 1.25rem 1.4rem; }
.kt-card-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.kt-card-header h2, .kt-card-header h3 { margin: 0; font-size: 1.05rem; }
.form-control, .form-select { border-radius: .55rem; background-color: var(--kt-surface); }

/* ---------- Kafelki statystyk ---------- */
.kt-stat { padding: 1rem 1.2rem; border-radius: .9rem; background: var(--kt-surface); border: 1px solid var(--kt-border); box-shadow: var(--kt-shadow); height: 100%; }
.kt-stat .value { font-size: 1.75rem; font-weight: 700; line-height: 1.1; }
.kt-stat .label { color: var(--kt-muted); font-size: .82rem; margin-top: .25rem; }
.kt-stat.error .value { color: var(--kt-error); }
.kt-stat.warn .value { color: var(--kt-warn); }
.kt-stat.ok .value { color: var(--kt-ok); }
.kt-stat.info .value { color: var(--kt-info); }

/* ---------- Plakietki statusów ---------- */
.kt-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .55rem; border-radius: 999px; font-size: .76rem; font-weight: 600; white-space: nowrap; }
.kt-badge.error { background: var(--kt-error-soft); color: var(--kt-error); }
.kt-badge.warn { background: var(--kt-warn-soft); color: var(--kt-warn); }
.kt-badge.ok { background: var(--kt-ok-soft); color: var(--kt-ok); }
.kt-badge.info { background: var(--kt-info-soft); color: var(--kt-info); }
.kt-badge.skip { background: var(--kt-skip-soft); color: var(--kt-skip); }
.kt-badge.navy { background: var(--kt-navy); color: #fff; }

/* ---------- Tabele ---------- */
.kt-table { width: 100%; font-size: .9rem; --bs-table-bg: transparent; }
.kt-table thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--kt-muted); font-weight: 650; border-bottom: 1px solid var(--kt-border); padding: .6rem .7rem; white-space: nowrap; background: var(--kt-surface); position: sticky; top: 0; z-index: 1; }
.kt-table td { padding: .65rem .7rem; border-bottom: 1px solid var(--kt-border); vertical-align: top; }
.kt-table tbody tr:hover { background: var(--kt-blue-soft); }
.kt-table tbody tr.clickable { cursor: pointer; }
.kt-table-wrap { overflow-x: auto; max-width: 100%; }
.kt-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kt-mono { font-family: ui-monospace, "Cascadia Code", Consolas, monospace; font-size: .85em; }

/* ---------- Układ aplikacji ---------- */
.kt-app { display: flex; min-height: 100vh; }
.kt-sidebar { width: 252px; flex-shrink: 0; background: var(--kt-sidebar-bg); color: var(--kt-sidebar-text); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.kt-brand { display: flex; align-items: center; gap: .6rem; padding: 1.1rem 1.25rem; color: #fff; font-weight: 700; font-size: 1.15rem; text-decoration: none; }
.kt-brand:hover { color: #fff; }
.kt-logo { width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, #3B82F6, #1D4ED8); display: grid; place-items: center; color: #fff; font-weight: 800; font-size: .95rem; }
.kt-nav { padding: .5rem .75rem; display: flex; flex-direction: column; gap: 2px; }
.kt-nav .section { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: #6B7FA3; padding: 1rem .6rem .35rem; }
.kt-nav a { display: flex; align-items: center; gap: .65rem; padding: .55rem .65rem; border-radius: .55rem; color: var(--kt-sidebar-text); text-decoration: none; font-size: .92rem; }
.kt-nav a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.kt-nav a.active { background: var(--kt-sidebar-active); color: #fff; box-shadow: inset 3px 0 0 #3B82F6; }
.kt-sidebar-footer { margin-top: auto; padding: 1rem 1.25rem; font-size: .8rem; color: #6B7FA3; }
.kt-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.kt-topbar { height: 60px; display: flex; align-items: center; gap: .75rem; padding: 0 1.5rem; background: var(--kt-surface); border-bottom: 1px solid var(--kt-border); position: sticky; top: 0; z-index: 20; }
.kt-content { padding: 1.5rem; max-width: 1400px; width: 100%; }
.kt-page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.kt-page-header h1 { font-size: 1.5rem; margin: 0; }
.kt-page-header .sub { color: var(--kt-muted); margin: .25rem 0 0; }
.kt-burger { display: none; }
.kt-credits-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 999px; background: var(--kt-blue-soft); color: var(--kt-blue); font-weight: 600; font-size: .85rem; text-decoration: none; }

@media (max-width: 991.98px) {
    .kt-sidebar { position: fixed; left: 0; top: 0; z-index: 1040; transform: translateX(-100%); transition: transform .2s ease; }
    .kt-app.nav-open .kt-sidebar { transform: none; box-shadow: 0 0 40px rgba(0, 0, 0, .35); }
    .kt-app.nav-open .kt-backdrop { position: fixed; inset: 0; background: rgba(2, 6, 23, .45); z-index: 1030; }
    .kt-burger { display: inline-flex; }
    .kt-content { padding: 1rem; }
    .kt-topbar { padding: 0 1rem; }
}

/* ---------- Publiczna strona ---------- */
.kt-public-nav { background: var(--kt-surface); border-bottom: 1px solid var(--kt-border); position: sticky; top: 0; z-index: 30; }
.kt-public-nav .kt-brand { color: var(--kt-navy); padding-left: 0; }
[data-bs-theme="dark"] .kt-public-nav .kt-brand { color: #fff; }
.kt-hero { background: radial-gradient(1200px 400px at 80% -10%, rgba(59, 130, 246, .25), transparent), linear-gradient(180deg, var(--kt-navy) 0%, #0E2A52 100%); color: #fff; padding: 5rem 0 4.5rem; }
.kt-hero h1 { font-size: clamp(2rem, 4vw, 3.1rem); font-weight: 750; line-height: 1.1; }
.kt-hero .lead { color: #C7D2E5; max-width: 640px; }
.kt-hero .btn-light { color: var(--kt-navy); font-weight: 650; }
.kt-section { padding: 4rem 0; }
.kt-feature-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--kt-blue-soft); color: var(--kt-blue); margin-bottom: .9rem; }
.kt-step { counter-increment: step; position: relative; padding-left: 3rem; }
.kt-step::before { content: counter(step); position: absolute; left: 0; top: 0; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--kt-blue); color: #fff; display: grid; place-items: center; font-weight: 700; }
.kt-price { border-radius: 1rem; padding: 1.6rem; background: var(--kt-surface); border: 1px solid var(--kt-border); height: 100%; display: flex; flex-direction: column; }
.kt-price.featured { border: 2px solid var(--kt-blue); box-shadow: 0 10px 30px rgba(29, 78, 216, .15); }
.kt-price .amount { font-size: 2.2rem; font-weight: 750; }
.kt-price ul { padding-left: 1.1rem; color: var(--kt-muted); flex: 1; }
.kt-footer { background: var(--kt-navy); color: #94A3B8; padding: 2.5rem 0; font-size: .9rem; }
.kt-footer a { color: #C7D2E5; text-decoration: none; }
.kt-precontract { border: 1px solid var(--kt-border); border-radius: .5rem; padding: .75rem 1rem; display: flex; flex-direction: column; gap: .2rem; }
.kt-seller { display: flex; flex-direction: column; gap: .4rem; }
.kt-paylogos { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.kt-paylogos img { background: #fff; border-radius: .25rem; padding: 2px 4px; }
.kt-app-footer { border-top: 1px solid var(--kt-border); padding: 1rem 1.5rem; color: var(--kt-muted, #64748B); display: flex; flex-direction: column; gap: .4rem; }

/* ---------- Strony konta ---------- */
.kt-auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; background: radial-gradient(900px 400px at 10% 0%, rgba(59, 130, 246, .12), transparent), var(--kt-bg); }
.auth-card { width: 100%; max-width: 560px; background: var(--kt-surface); border: 1px solid var(--kt-border); border-radius: 1rem; box-shadow: var(--kt-shadow); padding: 2rem; }
.auth-card-wide { max-width: 760px; }
.kt-auth .container, .kt-auth .row { max-width: 760px; }

/* ---------- Upload ---------- */
.kt-dropzone { border: 2px dashed var(--kt-border); border-radius: 1rem; padding: 2.2rem 1rem; text-align: center; background: var(--kt-surface); transition: border-color .15s, background .15s; cursor: pointer; }
.kt-dropzone.drag, .kt-dropzone:hover { border-color: var(--kt-blue-2); background: var(--kt-blue-soft); }
.kt-progress { height: .55rem; border-radius: 999px; background: var(--kt-skip-soft); overflow: hidden; }
.kt-progress > div { height: 100%; background: linear-gradient(90deg, #3B82F6, #1D4ED8); transition: width .2s; }
.kt-steps { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.kt-steps .s { display: flex; align-items: center; gap: .45rem; font-size: .85rem; color: var(--kt-muted); }
.kt-steps .s .n { width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center; background: var(--kt-skip-soft); font-weight: 700; font-size: .8rem; }
.kt-steps .s.done .n, .kt-steps .s.current .n { background: var(--kt-blue); color: #fff; }
.kt-steps .s.current { color: var(--kt-text); font-weight: 600; }

/* ---------- Szczegóły problemu (panel boczny) ---------- */
.kt-drawer-backdrop { position: fixed; inset: 0; background: rgba(2, 6, 23, .4); z-index: 1050; }
.kt-drawer { position: fixed; right: 0; top: 0; bottom: 0; width: min(560px, 100%); background: var(--kt-surface); z-index: 1060; box-shadow: -10px 0 40px rgba(0, 0, 0, .2); padding: 1.5rem; overflow-y: auto; }
.kt-kv { display: grid; grid-template-columns: 150px 1fr; gap: .45rem 1rem; font-size: .9rem; }
.kt-kv dt { color: var(--kt-muted); font-weight: 500; }
.kt-kv dd { margin: 0; word-break: break-word; }

/* ---------- Filtry ---------- */
.kt-filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.kt-filters .form-select, .kt-filters .form-control { width: auto; min-width: 150px; font-size: .88rem; }
.kt-chip { border: 1px solid var(--kt-border); background: var(--kt-surface); border-radius: 999px; padding: .25rem .75rem; font-size: .82rem; cursor: pointer; color: var(--kt-text); }
.kt-chip.active { background: var(--kt-blue); border-color: var(--kt-blue); color: #fff; }

/* ---------- Powiadomienia (toasty) ---------- */
.kt-toasts { position: fixed; right: 1rem; bottom: 1rem; z-index: 2000; display: flex; flex-direction: column; gap: .5rem; max-width: 380px; }
.kt-toast { padding: .8rem 1rem; border-radius: .7rem; background: var(--kt-surface); border: 1px solid var(--kt-border); box-shadow: var(--kt-shadow); border-left: 4px solid var(--kt-blue); font-size: .9rem; display: flex; gap: .75rem; align-items: start; }
.kt-toast.error { border-left-color: var(--kt-error); }
.kt-toast.success { border-left-color: var(--kt-ok); }
.kt-toast.warning { border-left-color: var(--kt-warn); }

.kt-empty { text-align: center; padding: 3rem 1rem; color: var(--kt-muted); }
.kt-empty .kt-feature-icon { margin: 0 auto 1rem; }
.kt-spinner { width: 1.1rem; height: 1.1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; display: inline-block; animation: kt-spin .8s linear infinite; vertical-align: -.15em; }
@keyframes kt-spin { to { transform: rotate(360deg); } }
.kt-legal-draft { border: 1px dashed var(--kt-warn); background: var(--kt-warn-soft); color: var(--kt-warn); border-radius: .6rem; padding: .75rem 1rem; }

/* Walidacja Blazor */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid var(--kt-error); }
.validation-message { color: var(--kt-error); font-size: .85rem; }

#blazor-error-ui { color-scheme: light only; background: #FEF3C7; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, .2); display: none; left: 0; padding: .6rem 1.25rem .7rem 1.25rem; position: fixed; width: 100%; z-index: 3000; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }
.blazor-error-boundary { background: var(--kt-error-soft); padding: 1rem; color: var(--kt-error); border-radius: .6rem; }
.blazor-error-boundary::after { content: "Wystąpił błąd podczas wyświetlania tego fragmentu strony. Odśwież stronę."; }