:root {
    --bg: #f5f7fa;
    --surface: #ffffff;
    --surface-soft: #f0f3f7;
    --text: #17202a;
    --muted: #667382;
    --line: #dfe5ec;
    --primary: #1769e0;
    --primary-dark: #0f52b8;
    --success: #18875d;
    --warning: #c47a08;
    --danger: #d13b33;
    --shadow: 0 14px 35px rgba(18, 32, 48, .08);
    --radius: 18px;
}

:root[data-theme="dark"] {
    --bg: #0f141a;
    --surface: #171e26;
    --surface-soft: #202a34;
    --text: #edf2f7;
    --muted: #a8b3bf;
    --line: #2e3a46;
    --primary: #6da9ff;
    --primary-dark: #8abaff;
    --shadow: 0 16px 40px rgba(0, 0, 0, .3);
}

* { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
html[data-theme="dark"] { color-scheme: dark; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.55 "Segoe UI", Arial, sans-serif; }
a { color: inherit; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-size: clamp(30px, 5vw, 46px); line-height: 1.08; letter-spacing: -.03em; }
h2 { margin-bottom: 6px; font-size: 20px; }
h3 { margin-bottom: 5px; font-size: 16px; }
small, .muted { color: var(--muted); }
form { margin: 0; }

.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 26px; min-height: 70px; padding: 10px max(18px, calc((100vw - 1240px) / 2)); border-bottom: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--surface) 91%, transparent); backdrop-filter: blur(18px); }
.logo { display: flex; align-items: center; gap: 11px; text-decoration: none; white-space: nowrap; }
.logo span, .auth-logo { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: linear-gradient(135deg, var(--primary), #56b1ff); color: #fff; font-weight: 800; }
.logo strong { font-size: 15px; }
.navigation { display: flex; flex: 1; gap: 4px; }
.navigation a { padding: 9px 12px; border-radius: 10px; color: var(--muted); text-decoration: none; font-weight: 600; }
.navigation a:hover { background: var(--surface-soft); color: var(--text); }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.icon-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); cursor: pointer; }

.page { width: min(1240px, calc(100% - 30px)); margin: 34px auto 80px; }
.page-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 25px; }
.page-head p { margin: 0; color: var(--muted); }
.eyebrow { display: block; margin-bottom: 7px; color: var(--primary); font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }

.card, .empty-card { padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.card-head, .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 19px; }
.card-head p, .section-heading p { margin: 0; color: var(--muted); }
.section-heading { justify-content: flex-start; }
.section-icon { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: color-mix(in srgb, var(--primary) 12%, var(--surface)); color: var(--primary); font-size: 12px; font-weight: 800; }
.stack { display: grid; gap: 20px; }
.layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 22px; align-items: start; }
.reminders-layout, .fuel-layout { grid-template-columns: 1fr; }
.sticky-card { position: static; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; padding: 9px 15px; border: 1px solid transparent; border-radius: 11px; text-decoration: none; font-weight: 700; cursor: pointer; transition: .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--primary); color: #fff; box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 24%, transparent); }
.btn-primary:hover { background: var(--primary-dark); }
.btn-secondary, .btn-light { border-color: var(--line); background: var(--surface); color: var(--text); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-small { min-height: 35px; padding: 6px 10px; font-size: 13px; }
.btn-block { width: 100%; }

.alert { margin-bottom: 20px; padding: 13px 16px; border: 1px solid; border-radius: 12px; font-weight: 700; }
.alert-success { border-color: #99d8ba; background: #e9f8f0; color: #166643; }
.alert-error { border-color: #eab0ac; background: #fdebea; color: #922b25; }

.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.stats article { padding: 19px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.stats span { display: block; color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.stats strong { display: block; margin-top: 8px; font-size: 28px; line-height: 1; }
.stats small { display: block; margin-top: 7px; }

.car-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.car-card { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow); transition: .2s ease; }
.car-card:hover { transform: translateY(-3px); box-shadow: 0 20px 42px rgba(18, 32, 48, .12); }
.car-photo { position: relative; height: 220px; background: var(--surface-soft); }
.car-photo img, .car-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.media-button { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.photo-placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: var(--muted); font-size: 58px; }
.year-badge { position: absolute; top: 14px; right: 14px; padding: 5px 10px; border-radius: 999px; background: rgba(15, 24, 33, .78); color: #fff; font-size: 12px; font-weight: 800; }
.car-card-body { padding: 20px; }
.car-title { display: flex; justify-content: space-between; gap: 12px; }
.car-title h2, .car-title p { margin-bottom: 2px; }
.car-title p { color: var(--muted); }
.car-title > strong { color: var(--primary); white-space: nowrap; }
.oc-line { display: flex; align-items: center; gap: 10px; margin: 16px 0; padding: 11px 12px; border-radius: 12px; background: var(--surface-soft); }
.oc-line > span { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); }
.oc-line div { display: grid; }
.oc-line strong { font-size: 13px; }
.oc-line small { font-size: 12px; }
.oc-success > span { background: var(--success); }
.oc-warning > span { background: var(--warning); }
.oc-danger > span { background: var(--danger); }
.mini-stats { display: flex; flex-wrap: wrap; gap: 7px; margin: 15px 0; }
.mini-stats span, .mini-stats a { padding: 7px 9px; border-radius: 9px; background: var(--surface-soft); color: var(--muted); text-decoration: none; font-size: 12px; }
.pills { display: flex; flex-wrap: wrap; gap: 7px; }
.pills span { padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); color: var(--primary); font-size: 12px; font-weight: 700; }
.car-card .pills { margin-bottom: 16px; }
.card-actions, .entry-actions, .form-actions { display: flex; flex-wrap: wrap; gap: 8px; }

.empty-card { display: grid; justify-items: center; padding: 54px 24px; text-align: center; }
.empty-card p { color: var(--muted); }
.empty-icon { margin-bottom: 13px; font-size: 48px; }

.car-hero { display: grid; grid-template-columns: minmax(280px, 430px) 1fr; gap: 32px; align-items: center; margin-bottom: 24px; padding: 26px; border-radius: 24px; background: linear-gradient(135deg, #15243a, #1769e0); color: #fff; box-shadow: var(--shadow); }
.car-hero-photo { height: 270px; overflow: hidden; border-radius: 18px; background: rgba(255,255,255,.08); }
.car-hero-content .eyebrow { color: #aad0ff; }
.car-hero-content p { color: rgba(255,255,255,.72); }
.hero-kpis { display: flex; flex-wrap: wrap; gap: 9px; margin: 22px 0; }
.hero-kpis span { padding: 8px 11px; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; background: rgba(255,255,255,.08); font-size: 12px; }
.car-hero .btn-secondary { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.1); color: #fff; }

label { display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 650; }
input, select, textarea, .field-output { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: var(--surface); color: var(--text); font-weight: 500; }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.form-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-section { padding: 24px; }
.insurance-section { border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); }
.form-hint { margin: 15px 0 0; padding: 11px 13px; border-radius: 11px; background: var(--surface-soft); color: var(--muted); font-size: 13px; }
.check { display: flex; align-items: center; gap: 9px; margin-top: 14px; }
.check input { width: 18px; min-height: 18px; }
.input-suffix { display: grid; grid-template-columns: 1fr auto; }
.input-suffix input { border-radius: 11px 0 0 11px; }
.input-suffix span { display: grid; min-width: 48px; place-items: center; border: 1px solid var(--line); border-left: 0; border-radius: 0 11px 11px 0; background: var(--surface-soft); }
.field-output { display: flex; align-items: center; background: var(--surface-soft); color: var(--primary); font-size: 18px; font-weight: 800; }
.sticky-submit { position: sticky; bottom: 14px; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 15px; background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.sticky-submit div { display: grid; }
.sticky-submit small { font-size: 12px; }

details.card { padding: 0; overflow: hidden; }
details.card > summary { display: flex; align-items: center; gap: 13px; min-height: 70px; padding: 18px 21px; list-style: none; cursor: pointer; }
details.card > summary::-webkit-details-marker { display: none; }
details.card > summary::before { content: "+"; display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; border-radius: 11px; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); color: var(--primary); font-size: 24px; }
details.card[open] > summary { border-bottom: 1px solid var(--line); background: var(--surface-soft); }
details.card[open] > summary::before { content: "−"; }
details.card > .form-spacing { margin: 0; padding: 22px; }
.summary-copy { display: grid; gap: 2px; }
.summary-copy strong { font-size: 18px; }
.summary-copy small { font-weight: 400; }

.data-list { display: grid; margin: 0; }
.data-list div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.data-list dt { color: var(--muted); }
.data-list dd { margin: 0; text-align: right; font-weight: 700; }
.info-block, .note { margin-top: 14px; padding: 13px; border-radius: 12px; background: var(--surface-soft); }
.info-block span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.info-block p, .note { margin-bottom: 0; color: var(--muted); }
.cost-list { display: grid; gap: 7px; margin-bottom: 16px; color: var(--primary); font-size: 20px; }
.progress-list { display: grid; gap: 12px; }
progress { width: 100%; height: 8px; overflow: hidden; border: 0; border-radius: 999px; }
progress::-webkit-progress-bar { background: var(--surface-soft); }
progress::-webkit-progress-value { background: linear-gradient(90deg, var(--primary), #56b1ff); }
progress::-moz-progress-bar { background: var(--primary); }
.danger-zone { border-color: color-mix(in srgb, var(--danger) 36%, var(--line)); }

.filters { display: grid; grid-template-columns: 2fr repeat(2, 1fr) auto auto; gap: 9px; margin-bottom: 20px; }
.reminders-filters { grid-template-columns: repeat(4, 1fr) auto auto; }
.timeline { display: grid; }
.timeline-item { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 18px; padding: 18px 0; border-top: 1px solid var(--line); }
.timeline-date strong, .timeline-date span { display: block; }
.timeline-date span { color: var(--muted); font-size: 12px; }
.timeline-content { padding-left: 17px; border-left: 3px solid var(--primary); }
.entry-head { display: flex; justify-content: space-between; gap: 18px; }
.entry-head > strong { color: var(--primary); white-space: nowrap; }
.tag, .status { display: inline-flex; padding: 5px 9px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.tag { background: var(--surface-soft); color: var(--primary); }
.entry-meta { color: var(--muted); font-size: 13px; }
.entry-actions form { display: inline-flex; }

.inline-upload { display: grid; grid-template-columns: 1.3fr 1fr auto; gap: 10px; margin-bottom: 20px; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gallery-grid figure { position: relative; margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.gallery-grid img { width: 100%; height: 180px; object-fit: cover; }
.gallery-grid figcaption { padding: 8px 10px; color: var(--muted); font-size: 12px; }
.gallery-grid form { position: absolute; top: 7px; right: 7px; }
.link-danger { padding: 5px 7px; border: 0; border-radius: 7px; background: rgba(155, 30, 24, .88); color: #fff; cursor: pointer; }

.reminder-list { display: grid; gap: 13px; }
.reminder-item { display: grid; gap: 14px; padding: 19px; border: 1px solid var(--line); border-left: 5px solid var(--primary); border-radius: 15px; background: var(--surface); }
.reminder-item.state-upcoming { border-left-color: var(--warning); }
.reminder-item.state-overdue { border-left-color: var(--danger); }
.reminder-item.state-completed { border-left-color: var(--success); opacity: .75; }
.reminder-item .status { align-self: flex-start; white-space: nowrap; }
.reminder-item > .entry-actions { justify-content: flex-end; padding-top: 12px; border-top: 1px solid var(--line); }
.reminder-detail { color: var(--text) !important; font-weight: 700; }
.reminder-dates { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 9px; color: var(--muted); font-size: 13px; }
.status-planned { background: #eaf3ff; color: #1769aa; }
.status-upcoming { background: #fff1cf; color: #875800; }
.status-overdue { background: #fde8e6; color: #a62d26; }
.status-completed { background: #e5f6ed; color: #176c45; }
.priority-high { color: var(--warning) !important; }
.priority-critical { color: var(--danger) !important; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
td small { display: block; margin-top: 3px; }
.cost-pills { margin-bottom: 18px; }

.modal[hidden] { display: none; }
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 38px; background: rgba(6, 10, 15, .9); }
.modal img, .modal iframe { max-width: min(1100px, 92vw); max-height: 88vh; border: 0; border-radius: 14px; background: #fff; }
.modal iframe { width: 90vw; height: 88vh; }
.modal-close { position: fixed; top: 17px; right: 22px; border: 0; background: transparent; color: #fff; font-size: 42px; cursor: pointer; }
.modal-open { overflow: hidden; }

.auth-body { display: grid; min-height: 100vh; place-items: center; padding: 20px; background: radial-gradient(circle at top, #235eac, #111923 68%); }
.auth-card { width: min(430px, 100%); padding: 34px; border-radius: 22px; background: var(--surface); box-shadow: 0 30px 75px rgba(0,0,0,.32); }
.install-card { width: min(780px, 100%); }
.auth-card .auth-logo { width: 58px; height: 58px; margin-bottom: 18px; }
.auth-card > p { color: var(--muted); }
.auth-card > small { display: block; margin-top: 20px; text-align: center; }

@media (max-width: 1050px) {
    .car-grid { grid-template-columns: repeat(2, 1fr); }
    .layout { grid-template-columns: 1fr; }
    .stats { grid-template-columns: repeat(2, 1fr); }
    .form-grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
    .topbar { flex-wrap: wrap; gap: 8px; padding: 10px 14px; }
    .logo { flex: 1; }
    .logo strong { display: none; }
    .navigation { order: 3; width: 100%; overflow-x: auto; }
    .navigation a { white-space: nowrap; }
    .page { width: min(100% - 20px, 1240px); margin-top: 22px; }
    .page-head, .car-title, .entry-head, .card-head { align-items: stretch; flex-direction: column; }
    .page-head { display: flex; }
    .stats, .car-grid, .form-grid, .form-grid-3, .gallery-grid { grid-template-columns: 1fr; }
    .car-hero { grid-template-columns: 1fr; padding: 16px; }
    .car-hero-photo { height: 220px; }
    .filters, .reminders-filters, .inline-upload { grid-template-columns: 1fr; }
    .timeline-item { grid-template-columns: 1fr; gap: 8px; }
    .timeline-content { padding-left: 12px; }
    .sticky-submit { position: static; align-items: stretch; flex-direction: column; }
    .sticky-submit .btn { width: 100%; }
    .reminder-item > .entry-actions { justify-content: flex-start; }
    details.card > summary { padding: 16px; }
    details.card > .form-spacing { padding: 17px 15px; }
    .modal { padding: 18px; }
}

@media (max-width: 480px) {
    .stats { grid-template-columns: 1fr 1fr; gap: 9px; }
    .stats article { padding: 14px; }
    .stats strong { font-size: 23px; }
    .card, .form-section { padding: 17px; }
    .car-photo { height: 200px; }
    .card-actions .btn { flex: 1; }
}


.schema-alert {
    display: grid;
    gap: 4px;
}

.schema-alert code,
.runtime-error code {
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(0, 0, 0, .08);
    font-family: Consolas, Monaco, monospace;
}

.runtime-error {
    max-width: 820px;
    margin: 20px auto;
}

.runtime-error pre {
    overflow-x: auto;
    padding: 14px;
    border-radius: 10px;
    background: var(--surface-soft);
    white-space: pre-wrap;
}


/* V13 — spójne moduły i lista rzeczy do zrobienia */
.page-sections,
.history-layout {
    display: grid;
    gap: 1.25rem;
}

.page-sections > .card,
.page-sections > details.card {
    border-radius: 20px;
    box-shadow: var(--shadow);
}

.page-sections .card-head,
.repair-task-card .card-head {
    align-items: flex-start;
    gap: 1rem;
}

.repair-task-form {
    padding-top: .5rem;
}

.task-fields {
    display: grid;
    gap: .75rem;
}

.task-field-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: center;
}

.task-field-row input {
    width: 100%;
}

.task-empty {
    margin-top: 1.25rem;
}

.repair-task-list {
    display: grid;
    gap: .7rem;
    margin-top: 1.35rem;
}

.repair-task-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-soft);
}

.repair-task-toggle {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
    flex: 1;
}

.task-checkbox {
    width: 1.6rem;
    height: 1.6rem;
    flex: 0 0 1.6rem;
    border: 2px solid var(--primary);
    border-radius: 6px;
    background: transparent;
    color: white;
    font-weight: 900;
    cursor: pointer;
}

.repair-task-item.is-completed .task-checkbox {
    background: var(--primary);
}

.repair-task-item.is-completed .repair-task-toggle span {
    text-decoration: line-through;
    opacity: .6;
}

@media (max-width: 640px) {
    .task-field-row {
        grid-template-columns: 1fr;
    }

    .task-field-row .btn {
        justify-self: start;
    }

    .repair-task-item {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* V13.1 — spójne widoki Terminy, Tankowania i lista rzeczy */
.compact-car-hero {
    margin-bottom: 24px;
}

.compact-car-hero .car-hero-photo {
    min-height: 220px;
}

.summary-count {
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    background: var(--primary-soft, #e8f1ff);
    color: var(--primary, #1264d8);
    font-size: .82rem;
    font-weight: 800;
}

.repair-task-card[open] > summary {
    margin-bottom: 2px;
}

.repair-task-heading {
    align-items: flex-start;
}

.fuel-timeline {
    margin-top: 20px;
}

.fuel-history-item .timeline-content {
    min-width: 0;
}

.fuel-entry-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
    margin-top: 14px;
    color: var(--muted);
}

.fuel-entry-grid b {
    color: var(--text);
}

.history-layout > .stats {
    margin-bottom: 0;
}

@media (max-width: 760px) {
    .compact-car-hero .car-hero-photo {
        min-height: 180px;
    }

    .repair-task-card > summary {
        align-items: flex-start;
    }

    .summary-count {
        margin-top: 2px;
    }

    .fuel-entry-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
    }
}


/* V13.2 — spójna typografia paneli i połączenie z historią */
.action-panel > summary,
.service-entry-panel > summary {
    font: inherit;
    color: var(--text);
}

.action-panel > summary .summary-copy,
.service-entry-panel > summary .summary-copy {
    min-width: 0;
}

.action-panel > summary .summary-copy strong,
.service-entry-panel > summary .summary-copy strong {
    display: block;
    margin: 0;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0;
    color: var(--text);
}

.action-panel > summary .summary-copy small,
.service-entry-panel > summary .summary-copy small {
    display: block;
    margin-top: 3px;
    font-family: inherit;
    font-size: .86rem;
    font-weight: 400;
    line-height: 1.35;
    letter-spacing: 0;
    color: var(--muted);
}

.action-panel > summary::marker,
.service-entry-panel > summary::marker {
    font-size: 0;
}

.summary-count {
    font-family: inherit;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1;
}

.task-to-service-notice {
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--primary-soft, #e8f1ff);
}

.task-to-service-notice strong {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--primary, #1264d8);
}

.task-to-service-notice span {
    font-weight: 700;
    color: var(--text);
}

.task-to-service-notice small {
    color: var(--muted);
}

.repair-task-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.repair-task-actions form {
    margin: 0;
}

@media (max-width: 760px) {
    .repair-task-item {
        align-items: stretch;
    }

    .repair-task-actions {
        justify-content: flex-start;
        padding-left: 0;
    }

    .repair-task-actions .btn,
    .repair-task-actions form,
    .repair-task-actions form .btn {
        width: 100%;
    }
}


/* V13.3 — zbiorcze przenoszenie zadań do historii */
.repair-task-bulk-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-muted, #f7f9fc);
}

.repair-task-bulk-toolbar > div {
    display: grid;
    gap: 3px;
}

.repair-task-bulk-toolbar strong {
    color: var(--text);
}

.repair-task-bulk-toolbar small {
    color: var(--muted);
}

.repair-task-item {
    position: relative;
}

.repair-task-select {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    cursor: pointer;
}

.repair-task-select input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.repair-task-select span {
    width: 24px;
    height: 24px;
    border: 2px solid var(--border);
    border-radius: 7px;
    background: var(--surface);
    transition:
        border-color .15s ease,
        background .15s ease,
        box-shadow .15s ease;
}

.repair-task-select input:checked + span {
    border-color: var(--primary, #1264d8);
    background:
        var(--primary, #1264d8)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")
        center / 16px 16px
        no-repeat;
}

.repair-task-select input:focus-visible + span {
    box-shadow: 0 0 0 4px rgba(18, 100, 216, .18);
}

.selected-task-list {
    display: grid;
    gap: 5px;
    margin: 4px 0;
    padding-left: 20px;
    color: var(--text);
}

@media (max-width: 760px) {
    .repair-task-bulk-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .repair-task-bulk-toolbar .btn {
        width: 100%;
    }

    .repair-task-item {
        grid-template-columns: auto 1fr;
    }

    .repair-task-actions {
        grid-column: 1 / -1;
    }
}


/* V14 — koszty posiadania, załączniki i mniej przycisków */
.ownership-currencies { display: grid; gap: 14px; }
.ownership-currency-card { padding: 14px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-muted, #f7f9fc); }
.ownership-total { display:flex; align-items:end; justify-content:space-between; gap:12px; padding-bottom:12px; margin-bottom:8px; border-bottom:1px solid var(--border); }
.ownership-total span { color:var(--muted); }
.ownership-total strong { font-size:1.35rem; }
.cost-breakdown { display:grid; gap:8px; margin:0; }
.cost-breakdown div { display:flex; justify-content:space-between; gap:12px; }
.cost-breakdown dt { color:var(--muted); }
.cost-breakdown dd { margin:0; font-weight:700; }
.ownership-note { margin-top:12px; font-size:.83rem; }
.compact-list, .attachment-list { display:grid; gap:9px; }
.compact-list article, .attachment-list article { display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid var(--border); }
.compact-list article > div:first-child, .attachment-copy { min-width:0; flex:1; display:grid; gap:3px; }
.compact-list small, .attachment-copy small { color:var(--muted); }
.attachment-copy p { margin:2px 0 0; color:var(--muted); }
.attachment-icon { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:12px; background:var(--primary-soft,#e8f1ff); color:var(--primary,#1264d8); font-size:.72rem; font-weight:800; }
.more-menu { position:relative; flex:0 0 auto; }
.more-menu > summary { list-style:none; cursor:pointer; }
.more-menu > summary::-webkit-details-marker { display:none; }
.icon-more { display:grid; place-items:center; width:38px; height:36px; border:1px solid var(--border); border-radius:10px; background:var(--surface); color:var(--text); font-weight:800; letter-spacing:2px; }
.more-menu-panel { position:absolute; z-index:20; top:calc(100% + 7px); left:0; min-width:170px; padding:7px; border:1px solid var(--border); border-radius:12px; background:var(--surface); box-shadow:0 15px 35px rgba(15,23,42,.16); }
.more-menu-panel.align-right { right:0; left:auto; }
.more-menu-panel a, .more-menu-panel button { display:block; width:100%; padding:9px 10px; border:0; border-radius:8px; background:transparent; color:var(--text); text-align:left; text-decoration:none; font:inherit; cursor:pointer; }
.more-menu-panel a:hover, .more-menu-panel button:hover { background:var(--surface-muted,#f7f9fc); }
.more-menu-panel form { margin:0; }
.compact-actions { align-items:center; }
@media (max-width:760px) {
  .attachment-list article { align-items:flex-start; flex-wrap:wrap; }
  .attachment-copy { min-width:calc(100% - 58px); }
  .attachment-list article > .btn { margin-left:54px; }
  .more-menu-panel { position:fixed; top:auto; right:16px!important; bottom:16px; left:16px!important; min-width:0; }
}