/* NOCLO panel: Dzisiaj, karta pobytu, lejek. Animacje: wejscie kart, liczniki, paski, rysowanie wykresu. */
@keyframes cardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
#view>.card,#view .cols>.card,#view .grid2>.card,#view .td-grid>.card,#view .td-tiles>.td-tile,#view .fn-kpis>.fn-kpi{animation:cardIn .38s cubic-bezier(.2,.7,.2,1) both}
#view .cols>.card:nth-child(2),#view .td-grid>.card:nth-child(2),#view .td-tiles>.td-tile:nth-child(2),#view .fn-kpis>.fn-kpi:nth-child(2){animation-delay:.06s}
#view .td-grid>.card:nth-child(3),#view .td-tiles>.td-tile:nth-child(3),#view .fn-kpis>.fn-kpi:nth-child(3){animation-delay:.12s}
#view .td-grid>.card:nth-child(4),#view .td-tiles>.td-tile:nth-child(4),#view .fn-kpis>.fn-kpi:nth-child(4){animation-delay:.18s}
#view .td-grid>.card:nth-child(5),#view .td-tiles>.td-tile:nth-child(5){animation-delay:.24s}
#view .td-grid>.card:nth-child(6),#view .td-tiles>.td-tile:nth-child(6){animation-delay:.3s}
@media (prefers-reduced-motion:reduce){#view *{animation:none!important;transition:none!important}}
.td-skel{height:52px;border-radius:10px;background:linear-gradient(90deg,#F1F3F5 25%,#E6E8EB 50%,#F1F3F5 75%);background-size:200% 100%;animation:shimmer 1.2s infinite;margin:.4rem 0}
/* Dzisiaj */
.td-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:0 0 1rem}
.td-head h2{margin:0;font-size:1.5rem;letter-spacing:-.02em}.td-head p{margin:.15rem 0 0;color:var(--m);font-size:13px;text-transform:capitalize}
.td-kpi{display:flex;gap:1.1rem;font-size:12.5px;color:var(--t2)}.td-kpi b{font-size:15px;color:var(--t)}
.td-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.6rem;margin-bottom:1.1rem}
.td-tile{display:flex;flex-direction:column;gap:.15rem;background:#fff;border:1px solid var(--l);border-radius:12px;padding:.85rem .9rem;text-decoration:none;color:var(--t);box-shadow:var(--sh);transition:transform .18s,box-shadow .18s,border-color .18s;position:relative;overflow:hidden}
.td-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,19,24,.08);border-color:#D5D9DE}
.td-tile .ic{width:30px;height:30px;border-radius:8px;background:#F3F4F6;display:inline-flex;align-items:center;justify-content:center;color:var(--m);margin-bottom:.35rem}.td-tile .ic .ms{font-size:18px}
.td-tile b{font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.05}.td-tile .l{font-size:12.5px;font-weight:600}.td-tile small{font-size:11.5px;color:var(--m)}
.td-tile.on .ic{background:#EFEFEF;color:#17152b}.td-tile.warn .ic{background:#EFEDFA;color:var(--p)}.td-tile.warn b{color:var(--p)}
.td-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
.td-sec .ch .cnt{min-width:22px;height:22px;padding:0 .45rem;border-radius:999px;background:#F3F4F6;color:var(--t2);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.td-sec .ch .hint{margin-left:auto;font-size:11.5px;color:var(--m);font-weight:400}
.td-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .7rem;padding:.6rem 0;border-bottom:1px solid var(--l)}.td-row:last-child{border-bottom:0}.td-row .tx{flex:1 1 230px;min-width:200px}.td-row>.pill{flex:none}.td-row .acts{margin-left:auto}
.td-row .av{flex:none;width:36px;height:36px;border-radius:50%;background:#EFEFEF;color:#17152b;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12.5px}
.td-row .av.rm{background:#F3F4F6;color:var(--t2)}.td-row .av.warn{background:#EFEDFA;color:var(--p)}.td-row .av .ms{font-size:18px}
.td-row .tx{flex:1 1 210px;min-width:190px}.td-row .tx>b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.td-row .tx small b{display:inline;font-weight:600;color:var(--t)}.td-row .tx small{display:block;color:var(--m);font-size:12px;margin-top:.1rem;line-height:1.35}
.td-row .tx small.q{color:var(--t2);font-style:italic;white-space:normal}.td-row .tx b small.w{font-weight:500;color:var(--m);font-size:11.5px;margin-left:.3rem}
.td-row .tx .due{color:var(--p);font-weight:700;margin-left:.3rem}
.td-row .acts{display:flex;gap:.35rem;flex:none;flex-wrap:wrap;justify-content:flex-end}
.td-row .sel{font:inherit;font-size:12px;padding:.35rem .5rem;border:1px solid var(--l);border-radius:6px;background:#fff;color:var(--t2);max-width:170px}
.btn.sm.o{background:#fff;border-color:var(--l)}
.td-empty{display:flex;align-items:center;gap:.6rem;color:var(--m);font-size:13px;padding:.5rem 0}.td-empty .ms{color:#16A34A;font-size:20px}
.td-empty.big{flex-direction:column;align-items:flex-start;gap:.3rem;padding:1rem 0}.td-empty.big .ms{font-size:34px;color:var(--m)}.td-empty.big b{color:var(--t);font-size:15px}.td-empty.big small{font-size:13px;line-height:1.5}
.pill.red{background:var(--red)}.pill.soft{background:#EEF0F2;color:var(--t2)}
@media (max-width:1100px){.td-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.td-grid{grid-template-columns:1fr}.td-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.td-row{flex-wrap:wrap}.td-row .acts{width:100%;justify-content:flex-start;padding-left:calc(36px + .7rem)}.td-kpi{gap:.8rem}}
/* Karta rezerwacji: Pobyt */
.stay-tab{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.st-box{border:1px solid var(--l);border-radius:10px;padding:.7rem .85rem;background:#fff;animation:cardIn .3s ease both}
.st-box.wide{grid-column:1/-1}.st-box.warn{border-color:#F5C6A5;background:#FFFBF8}.st-box.ok{border-color:#CDEBD6}
.st-h{display:flex;align-items:center;gap:.4rem;font-weight:700;font-size:12.5px;color:var(--t2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.45rem}.st-h .ms{font-size:17px;color:var(--p)}.st-h .cnt{margin-left:.3rem;background:#F3F4F6;border-radius:999px;padding:0 .4rem;font-size:11px}
.st-kv{display:flex;justify-content:space-between;gap:.8rem;font-size:13px;padding:.22rem 0}.st-kv span{color:var(--m)}.st-kv b{font-weight:600;text-align:right}.st-kv b small{font-weight:400;color:var(--m)}
.st-kv .due{color:var(--p)}.st-kv .ok{color:#15803D}
.st-acts{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.5rem}
.st-msg{font-size:12.5px;padding:.4rem .55rem;border-radius:8px;background:#F7F8FA;margin:.3rem 0;line-height:1.4}.st-msg.in{background:#EFEFEF}.st-msg small{display:block;color:var(--m);font-size:11px;margin-bottom:.1rem}
.st-task{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;border-bottom:1px solid var(--l)}.st-task:last-child{border-bottom:0}.st-task .ms{color:var(--p)}.st-task div{flex:1}.st-task b{display:block;font-size:13px}.st-task small{color:var(--m);font-size:11.5px}
.note.ok{color:#15803D}
.tl{position:relative;padding-left:1.1rem}.tl:before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--l)}
.tli{position:relative;padding:.3rem 0 .45rem;font-size:13px;line-height:1.45}.tli i{position:absolute;left:-1.1rem;top:.55rem;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--p)}.tli small{display:block;color:var(--m);font-size:11.5px}
@media (max-width:640px){.stay-tab{grid-template-columns:1fr}}
/* Lejek */
.fn-seg{margin-left:.6rem}
.fn-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin:0 0 1rem}
.fn-kpi{background:#fff;border:1px solid var(--l);border-radius:12px;padding:.85rem .9rem;box-shadow:var(--sh)}.fn-kpi b{display:block;font-size:26px;font-weight:700;letter-spacing:-.02em}.fn-kpi span{display:block;font-size:12.5px;font-weight:600;margin-top:.1rem}.fn-kpi small{color:var(--m);font-size:11.5px}
.fn-steps{display:flex;flex-direction:column;gap:.35rem}
.fn-step{display:grid;grid-template-columns:190px 1fr 48px 42px;gap:.7rem;align-items:center;font-size:13px}
.fn-lab{display:flex;align-items:center;gap:.4rem;font-weight:600}.fn-lab .ms{font-size:18px;color:var(--p)}
.fn-bar{height:14px;background:#F1F3F5;border-radius:999px;overflow:hidden}.fn-bar i{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--p),#F0A07C);transition:width .9s cubic-bezier(.2,.7,.2,1)}
.fn-bar i.red{background:linear-gradient(90deg,#DC2626,#F87171)}.fn-bar i.green{background:linear-gradient(90deg,#16A34A,#4ADE80)}
.fn-step b{text-align:right;font-size:15px}.fn-step small{color:var(--m);text-align:right}
.fn-drop{display:inline-flex;align-items:center;gap:.25rem;font-size:11.5px;color:var(--m);margin-left:200px}.fn-drop .ms{font-size:14px}.fn-drop.worst{color:var(--red);font-weight:600}
.fn-area{width:100%;height:190px;display:block}.fn-area .grid line{stroke:#EEF0F2;stroke-width:1}.fn-area .line{fill:none;stroke:var(--p);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2000;stroke-dashoffset:2000;transition:stroke-dashoffset 1.6s ease-out}.fn-area .line.go{stroke-dashoffset:0}
.fn-area .fill{opacity:0;transition:opacity .8s ease .6s}#view.in .fn-area .fill{opacity:1}.fn-area .dot{fill:#fff;stroke:var(--p);stroke-width:2;opacity:0;transition:opacity .4s ease 1.2s}#view.in .fn-area .dot{opacity:1}
.fn-area .fb{fill:#17152b;opacity:.75}.fn-area text{font-size:10px;fill:var(--m)}
.fn-leg{display:flex;gap:1rem;font-size:11.5px;color:var(--m);margin-top:.5rem}.fn-leg span{display:inline-flex;align-items:center;gap:.3rem}.fn-leg i{width:14px;height:8px;border-radius:2px;display:inline-block}.fn-leg .ln{background:var(--p)}.fn-leg .bx{background:#17152b}.fn-leg .v{background:#C7CCD3}.fn-leg .p{background:var(--p)}
.fn-room{padding:.4rem 0;border-bottom:1px solid var(--l)}.fn-room:last-child{border-bottom:0}.fn-room .nm{font-size:13px;font-weight:600;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}.fn-room small{color:var(--m);font-size:11.5px}
.fn-dual{position:relative;height:12px;background:#F1F3F5;border-radius:999px;margin:.3rem 0 .2rem;overflow:hidden}.fn-dual i{position:absolute;left:0;top:0;height:100%;width:0;border-radius:999px;transition:width .9s cubic-bezier(.2,.7,.2,1)}.fn-dual i.v{background:#C7CCD3}.fn-dual i.p{background:var(--p)}
.fn-dev{display:flex;gap:1rem;align-items:center}.fn-donut{width:110px;height:110px;flex:none}.fn-donut .bg{fill:none;stroke:#F1F3F5;stroke-width:10}.fn-donut .seg{fill:none;stroke:var(--p);stroke-width:10;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset 1.2s cubic-bezier(.2,.7,.2,1)}.fn-donut .big{font-size:16px;font-weight:700;fill:var(--t)}.fn-donut .sm{font-size:9px;fill:var(--m)}
.fn-devt{flex:1}.fn-pay .fn-step{grid-template-columns:190px 1fr 48px}
.fn-tips{list-style:none;margin:0;padding:0}.fn-tips li{display:flex;gap:.6rem;align-items:flex-start;font-size:13.5px;line-height:1.5;padding:.45rem 0;border-bottom:1px solid var(--l)}.fn-tips li:last-child{border-bottom:0}.fn-tips .ms{color:var(--p);flex:none}
.hint{color:var(--m);font-size:12.5px;margin:.6rem 0 0;line-height:1.5}
@media (max-width:900px){.fn-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.fn-step{grid-template-columns:130px 1fr 40px 36px}.fn-drop{margin-left:140px}.fn-pay .fn-step{grid-template-columns:130px 1fr 40px}}

/* ===== Dzisiaj: pasek powitalny i kolory (2026) ===== */
.td-hero{display:flex;align-items:stretch;gap:1.6rem;flex-wrap:wrap;margin:0 0 1.1rem;padding:1.35rem 1.5rem;border-radius:18px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(120deg,#17152b 0%,#17152b 46%,#262341 100%);box-shadow:0 18px 40px -22px rgba(23, 21, 43,.75);animation:cardIn .42s cubic-bezier(.2,.7,.2,1) both}
.td-hero::after{content:"";position:absolute;right:-90px;top:-130px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(88, 70, 199,.34),transparent 62%);pointer-events:none}
.td-hero::before{content:"";position:absolute;left:-70px;bottom:-160px;width:360px;height:360px;border-radius:50%;border:64px solid rgba(255,255,255,.028);pointer-events:none}
.th-l{position:relative;flex:1 1 320px;min-width:260px;display:flex;flex-direction:column;gap:.35rem}
.th-day{margin:0;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.5);font-weight:700}
.td-hero h2{margin:.1rem 0 0;font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:1.2;letter-spacing:-.02em;font-weight:700;color:#fff}
.td-hero h2 b{color:#C4B5FD;font-weight:800}
.th-sub{margin:.15rem 0 .1rem;font-size:13.5px;color:rgba(255,255,255,.72)}
.th-sub b{color:#fff;font-weight:700}
.td-stan{align-self:flex-start;display:inline-flex;align-items:center;gap:.4rem;margin-top:.45rem;padding:.34rem .7rem;border-radius:999px;font-size:12.5px;font-weight:600}
.td-stan .ms{font-size:17px}
.td-stan.ok{background:rgba(34,197,94,.16);color:#8BE2B0}
.td-stan.robi{background:rgba(196,181,253,.16);color:#DCD2FE}
.td-stan.robi b{color:#fff;font-weight:800}
.th-mini{display:flex;gap:1.6rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid rgba(255,255,255,.1)}
.th-mini span{display:flex;flex-direction:column;font-size:11.5px;color:rgba(255,255,255,.58);line-height:1.3}
.th-mini b{font-size:19px;font-weight:800;color:#fff;letter-spacing:-.02em}
.th-r{position:relative;flex:0 0 auto;display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.th-ring{position:relative;width:130px;height:130px;flex:none}
.th-ring svg{width:130px;height:130px;transform:rotate(-90deg)}
.th-ring .bg{fill:none;stroke:rgba(255,255,255,.1);stroke-width:11}
.th-ring .seg{fill:none;stroke:url(#x);stroke:#C4B5FD;stroke-width:11;stroke-linecap:round;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.7,.2,1)}
.th-ring-t{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.th-ring-t b{font-size:28px;font-weight:800;letter-spacing:-.03em;line-height:1}
.th-ring-t b i{font-style:normal;font-size:15px;font-weight:700;color:rgba(255,255,255,.6);margin-left:1px}
.th-ring-t small{font-size:10.5px;color:rgba(255,255,255,.55);text-align:center;max-width:86px;line-height:1.25}
.th-week{flex:0 0 auto;min-width:190px}
.th-week-h{display:block;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.45);font-weight:700;margin-bottom:.6rem}
.tw-bars{display:flex;align-items:flex-end;gap:.4rem;height:84px}
.tw-d{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:.35rem;height:100%;width:23px}
.tw-d i{display:block;width:100%;border-radius:5px 5px 2px 2px;background:rgba(255,255,255,.22);height:4px;transition:height .9s cubic-bezier(.2,.7,.2,1)}
.tw-d.dzis i{background:linear-gradient(180deg,#C4B5FD,#5846C7)}
.tw-d em{font-style:normal;font-size:10.5px;color:rgba(255,255,255,.5);font-weight:600}
.tw-d.dzis em{color:#C4B5FD}
@media (max-width:980px){.td-hero{padding:1.15rem 1.15rem;gap:1.1rem}.th-r{width:100%;justify-content:space-between}.th-week{flex:1}}
@media (max-width:520px){.th-ring,.th-ring svg{width:104px;height:104px}.th-ring-t b{font-size:23px}.tw-bars{height:66px}.tw-d{width:18px}}

/* kafelki: kazdy ma swoj kolor, pusty jest spokojny */
.td-tile{border-left:3px solid transparent}
.td-tile .kr{position:absolute;right:-26px;top:-26px;width:76px;height:76px;border-radius:50%;background:currentColor;opacity:.07;pointer-events:none;transition:transform .25s}
.td-tile:hover .kr{transform:scale(1.18)}
.td-tile.pusto{color:var(--m)}
.td-tile.pusto .ic{background:#F3F4F6;color:#9AA1AA}
.td-tile.pusto b{color:#AEB4BC}
.td-tile.pusto .kr{opacity:0}
.td-tile.on.t-przyj{color:#17152b;border-left-color:#17152b}
.td-tile.on.t-przyj .ic{background:#EFEFEF;color:#17152b}
.td-tile.on.t-wyj{color:#5e5b71;border-left-color:#5e5b71}
.td-tile.on.t-wyj .ic{background:#F3F4F6;color:#5e5b71}
.td-tile.on.t-sprz{color:#9A6B00;border-left-color:#C08A1E}
.td-tile.on.t-sprz .ic{background:#FDF3DC;color:#9A6B00}
.td-tile.on.t-kasa{color:#C0562B;border-left-color:var(--p)}
.td-tile.on.t-kasa .ic{background:#EFEDFA;color:var(--p)}
.td-tile.on.t-wiad{color:#0B7C88;border-left-color:#0E9AA7}
.td-tile.on.t-wiad .ic{background:#E2F6F8;color:#0B7C88}
.td-tile.on.t-inte{color:#B3261E;border-left-color:#C43D3D}
.td-tile.on.t-inte .ic{background:#FDECEC;color:#B3261E}
.td-tile.on b{color:currentColor}
.td-tile .l,.td-tile small{color:var(--t)}
.td-tile small{color:var(--m)}

/* naglowki sekcji: ikona w kolorze sekcji */
.td-sec .ch{display:flex;align-items:center;gap:.55rem}
.td-sec .ch .si{flex:none;width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center}
.td-sec .ch .si .ms{font-size:17px}
.td-sec.s-przyj .si{background:#EFEFEF;color:#17152b}
.td-sec.s-wyj .si{background:#F3F4F6;color:#5e5b71}
.td-sec.s-sprz .si{background:#FDF3DC;color:#9A6B00}
.td-sec.s-kasa .si{background:#EFEDFA;color:var(--p)}
.td-sec.s-wiad .si{background:#E2F6F8;color:#0B7C88}
.td-sec.s-inte .si{background:#FDECEC;color:#B3261E}
.td-sec .ch h3{margin-right:0}
.td-sec .ch h3{white-space:nowrap}
.td-sec .ch .hint{flex:1 1 100%;margin-left:0;order:3;padding-top:.15rem}
@media (min-width:1280px){.td-sec .ch .hint{flex:0 1 auto;margin-left:auto;order:0;padding-top:0;text-align:right}}
