/* PNP_PISACZEK_ZAKUPY_CSS_V1 — Zakupy (Z0.2). Układ telefonu najpierw: duże pola dotyku (≥ 48 px), jedna kolumna, czytelne dla seniora. */
:root{
  --bg:#f3f6f4; --panel:#ffffff; --ink:#0f1f17; --muted:#56665d; --line:#d8e2dc;
  --brand:#16805c; --brand-ink:#ffffff; --brand-soft:#e2f3eb; --warn:#b42318; --warn-soft:#fdecea; --gold:#a8791f;
  --f-ui: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --r:14px; color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0c1511; --panel:#14211b; --ink:#ecf4ef; --muted:#a3b5aa; --line:#2a3d33;
  --brand:#4cc995; --brand-ink:#06150e; --brand-soft:#173527; --warn:#ff8a80; --warn-soft:#3a1714; --gold:#e3bd62; color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0c1511; --panel:#14211b; --ink:#ecf4ef; --muted:#a3b5aa; --line:#2a3d33;
  --brand:#4cc995; --brand-ink:#06150e; --brand-soft:#173527; --warn:#ff8a80; --warn-soft:#3a1714; --gold:#e3bd62; color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.45 var(--f-ui);-webkit-text-size-adjust:100%}
.zk-wrap{max-width:720px;margin:0 auto;padding:12px max(16px,env(safe-area-inset-right)) 96px max(16px,env(safe-area-inset-left))}
.zk-hint{color:var(--muted);font-size:15px}
.zk-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:24px;margin-top:24px}
.zk-center{text-align:center}.zk-center img{border-radius:50%}
.zk-big{font-size:20px}
.zk-card h1{font-size:26px;line-height:1.2;margin:.3em 0 .5em}
.zk-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.zk-centerrow{justify-content:center}.zk-between{justify-content:space-between}
.zk-btn{min-height:48px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:600 17px var(--f-ui);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;gap:6px}
.zk-btn:hover{border-color:var(--brand)}
.zk-btn:focus-visible,.zk-icon:focus-visible,.zk-check:focus-visible,.zk-main:focus-visible,.zk-chip:focus-visible,.zk-listbtn:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.zk-primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.zk-warn{color:var(--warn);border-color:var(--warn)}
.zk-small{min-height:40px;font-size:15px;padding:0 12px}
.zk-icon{min-width:48px;min-height:48px;border:0;background:transparent;color:var(--ink);font-size:20px;border-radius:12px;cursor:pointer}
.zk-icon:hover{background:var(--brand-soft)}

/* nagłówek */
.zk-head{display:flex;align-items:center;gap:6px;margin:4px 0 10px}
.zk-listbtn{flex:1;min-width:0;min-height:52px;display:flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--ink);font:800 26px var(--f-ui);text-align:left;padding:0 4px;cursor:pointer;border-radius:12px}
.zk-listname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zk-caret{font-size:16px;color:var(--muted)}
.zk-people{display:flex}
.zk-av{width:34px;height:34px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font:700 15px var(--f-ui);display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--panel);margin-left:-8px;flex:none}
.zk-av-s{width:28px;height:28px;font-size:13px;margin:0}

/* dodawanie */
.zk-addbox{position:sticky;top:0;z-index:5;background:var(--bg);padding:6px 0 8px}
.zk-addrow{display:flex;gap:8px}
.zk-add{flex:1;min-width:0;min-height:56px;border:2px solid var(--line);border-radius:14px;padding:0 16px;font:18px var(--f-ui);background:var(--panel);color:var(--ink)}
.zk-add:focus{outline:none;border-color:var(--brand)}
.zk-addbtn{min-width:56px;font-size:28px;padding:0}
.zk-sug{display:flex;gap:8px;overflow-x:auto;padding-top:8px;scrollbar-width:none}
.zk-sug:empty{display:none}
.zk-chip{flex:none;min-height:40px;padding:0 14px;border-radius:20px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:15px var(--f-ui);cursor:pointer}
.zk-chip:hover{border-color:var(--brand);background:var(--brand-soft)}

.zk-shopping,.zk-offline{margin:6px 0;padding:10px 14px;border-radius:12px;font-weight:600}
.zk-shopping{background:var(--brand-soft);color:var(--brand)}
.zk-offline{background:var(--warn-soft);color:var(--warn);font-size:15px}
.zk-empty{color:var(--muted);text-align:center;padding:40px 0}

/* lista */
.zk-group{margin-top:14px}
.zk-cat{font:700 13px var(--f-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 6px 4px}
.zk-items{list-style:none;margin:0;padding:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.zk-item{display:flex;align-items:center;gap:6px;min-height:58px;padding:0 10px 0 4px;border-top:1px solid var(--line);background:var(--panel);transition:transform .15s,background .4s;touch-action:pan-y}
.zk-item:first-child{border-top:0}
.zk-item.pending{opacity:.55}
.zk-item.zk-flash{background:var(--brand-soft)}
.zk-check{flex:none;width:48px;height:48px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.zk-check::before{content:"";width:26px;height:26px;border:2px solid var(--muted);border-radius:8px;box-sizing:border-box}
.zk-check[aria-checked="true"]::before{background:var(--brand);border-color:var(--brand);content:"✓";color:var(--brand-ink);font:800 18px/22px var(--f-ui);text-align:center}
.zk-main{flex:1;min-width:0;min-height:56px;border:0;background:transparent;color:var(--ink);text-align:left;padding:6px 4px;cursor:pointer;display:flex;flex-direction:column;justify-content:center}
.zk-name{font:500 18px var(--f-ui);overflow-wrap:anywhere}
.zk-note{font-size:14px;color:var(--muted);overflow-wrap:anywhere}
.zk-qty{flex:none;font:600 16px var(--f-ui);color:var(--muted);white-space:nowrap}
.zk-item.done .zk-name{text-decoration:line-through;color:var(--muted)}
.zk-bought{margin-top:22px}
.zk-bought-head{border:0;background:transparent;color:var(--muted);font:700 16px var(--f-ui);min-height:48px;cursor:pointer;padding:0 4px}
.zk-bought .zk-btn{margin-top:10px}

/* arkusze */
.zk-sheet-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:50;display:flex;align-items:flex-end;justify-content:center}
.zk-sheet{background:var(--panel);color:var(--ink);width:100%;max-width:560px;max-height:88vh;overflow:auto;border-radius:18px 18px 0 0;padding:8px 18px max(20px,env(safe-area-inset-bottom))}
@media (min-width:700px){.zk-sheet-bg{align-items:center}.zk-sheet{border-radius:18px}}
.zk-sheet-head{display:flex;align-items:center;justify-content:space-between}
.zk-sheet-head h2{font-size:20px;margin:8px 0}
.zk-form{display:flex;flex-direction:column;gap:8px}
.zk-lbl{font:600 14px var(--f-ui);color:var(--muted);margin-top:6px}
.zk-input{min-height:50px;border:1px solid var(--line);border-radius:12px;padding:0 14px;font:17px var(--f-ui);background:var(--bg);color:var(--ink);width:100%}
.zk-row .zk-input{width:auto;flex:1;min-width:0}
.zk-qtyin{max-width:140px}.zk-unit{max-width:120px}
.zk-check-lbl{display:flex;align-items:center;gap:10px;min-height:48px;font-size:16px}
.zk-check-lbl input{width:22px;height:22px}
.zk-lists,.zk-members{list-style:none;margin:0 0 12px;padding:0}
.zk-listrow{width:100%;min-height:56px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 14px;margin-bottom:8px;cursor:pointer;font:17px var(--f-ui)}
.zk-listrow.on{border-color:var(--brand);background:var(--brand-soft)}
.zk-listrow-name{font-weight:700;text-align:left}.zk-listrow-meta{font-size:14px;color:var(--muted)}
.zk-members li{display:flex;align-items:center;gap:10px;min-height:52px}
.zk-members .zk-av{margin:0}
.zk-mname{flex:1}
.zk-share{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.zk-linkbox:empty{display:none}
.zk-danger{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}

.zk-toast{position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translate(-50%,140%);z-index:60;background:var(--ink);color:var(--panel);padding:10px 10px 10px 18px;border-radius:14px;display:flex;align-items:center;gap:12px;max-width:calc(100% - 32px);font-size:16px;transition:transform .2s;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.zk-toast.on{transform:translate(-50%,0)}
.zk-toast-btn{min-height:44px;border:0;border-radius:10px;background:var(--brand);color:var(--brand-ink);font:700 16px var(--f-ui);padding:0 14px;cursor:pointer;flex:none}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}

/* Z0.4 — tryb sklepu */
.zk-wrap{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.zk-foot{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;gap:10px;justify-content:center;padding:10px max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:linear-gradient(transparent,var(--bg) 30%)}
.zk-foot:empty{display:none}
.zk-wide{flex:1;max-width:520px;min-height:56px;font-size:18px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.zk-round{width:56px;min-height:56px;border-radius:50%;font-size:26px;padding:0;flex:none;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.zk-shop .zk-item{min-height:68px}
.zk-shop .zk-name{font-size:21px;font-weight:600}
.zk-shop .zk-qty{font-size:18px}
.zk-shop .zk-check{width:60px;height:60px}
.zk-shop .zk-check::before{width:32px;height:32px;border-radius:10px}
.zk-shop .zk-check[aria-checked="true"]::before{font-size:22px;line-height:28px}
.zk-shopping.zk-me{font-weight:500;font-size:15px}
.zk-pushcard{display:flex;align-items:center;gap:10px;margin:6px 0;padding:8px 8px 8px 14px;border:1px solid var(--brand);border-radius:12px;background:var(--panel);font-size:15px}
.zk-pushcard span{flex:1}

/* Z1.1 — „Pewnie się kończy”, „Powtórz ostatnie zakupy” */
.zk-sug{align-items:center}
.zk-sug-lbl{flex:none;font-size:13px;font-weight:700;color:var(--muted)}
.zk-chip.zk-due{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,var(--panel))}
.zk-hist{margin-top:10px}
.zk-histlist{list-style:none;margin:0;padding:0}
.zk-histlist .zk-check-lbl{min-height:44px}
.zk-wide2{width:100%;margin:4px 0 8px}

/* Z1.2 — przypomnienia */
.zk-remind{margin:10px 0;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.zk-remind .zk-row{margin:6px 0}
.zk-remlist{list-style:none;margin:6px 0 0;padding:0}
.zk-remlist li{display:flex;align-items:center;justify-content:space-between;min-height:44px}

/* pod listą: zaplanowane przypomnienia (PNP_PISACZEK_ZAKUPY_REMINDERS_ON_LIST_V1) */
.zk-rems{margin-top:22px}
.zk-remrow{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 6px 0 14px;border-top:1px solid var(--line)}
.zk-remrow:first-child{border-top:0}
.zk-remicon{font-size:18px}
.zk-remtxt{flex:1;font-size:17px}
.zk-remadd{margin-top:10px}
.zk-remind.zk-bare{border:0;margin:0;padding:0}

/* Z2 — pomysł na listę */
.zk-chip.zk-idea{border-color:var(--brand);color:var(--brand);font-weight:600}
.zk-ta{min-height:84px;padding:10px 14px;resize:vertical;font:17px/1.4 var(--f-ui)}
.zk-idea-title{margin:14px 0 2px;font-size:18px}
.zk-idea-note{margin:-6px 0 6px 36px}
.zk-tag{margin-left:8px;font-size:12px;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:10px;padding:1px 8px}
.zk-err{color:var(--warn);font-weight:600}

/* Z3 — ceny, sklepy, zdjęcia */
.zk-price{display:block;font-size:13px;font-weight:600;color:var(--muted);text-align:right}
.zk-sum{margin:10px 2px 0;font-size:15px;color:var(--muted);display:flex;flex-direction:column;gap:2px}
.zk-budget{font-weight:700;color:var(--brand)}
.zk-budget.over{color:var(--warn)}
.zk-thumb{flex:none;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg);cursor:pointer}
.zk-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.zk-photobox{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.zk-photo-mid{width:120px;height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}
.zk-photo-big{width:100%;max-height:70vh;object-fit:contain;border-radius:12px;background:#000}
.zk-linkbtn{border:0;background:transparent;color:var(--brand);font:600 16px var(--f-ui);cursor:pointer;padding:6px 0;text-align:left}
.zk-order{list-style:none;margin:0;padding:0}
.zk-order li{display:flex;align-items:center;gap:4px;min-height:48px;border-top:1px solid var(--line)}
.zk-order li span{flex:1}
.zk-stores{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}

/* Z4 — skaner kodów */
.zk-scanbtn{background:var(--panel);color:var(--ink);font-size:24px}
.zk-scanvideo{width:100%;max-height:46vh;object-fit:cover;border-radius:12px;background:#000}
.zk-scanform:empty{display:none}
.zk-scanform{display:flex;flex-direction:column;gap:8px;margin-top:6px}
