/* Widok wątku, wiadomości, załączniki, panel boczny (karta klienta, notatki, asystent). */
.watek-przewijany { flex: 1; overflow-y: auto; padding: 0 0 24px; overscroll-behavior: contain; }
.watek-naglowek { padding: 18px 24px 6px 72px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.watek-temat { font: 500 24px/1.25 var(--font-display); letter-spacing: -0.01em; margin-right: 6px; overflow-wrap: anywhere; }
.watek-stan { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 6px 24px 12px 72px; }
.stan-przycisk { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 10px; border: 1.5px solid var(--linia2); font-weight: 600; font-size: 13px; background: var(--powierzchnia); }
.stan-przycisk:hover { background: var(--hover); border-color: var(--tekst3); }
.stan-przycisk.ustawiony { background: var(--s-bg, var(--akcent-tlo)); color: var(--s-fg, var(--tekst)); border-color: transparent; }
.baner { margin: 4px 24px 10px 72px; padding: 10px 14px; border-radius: 12px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--akcent-tlo); border: 1px solid color-mix(in oklab, var(--akcent) 40%, transparent); }
.baner.ostrzezenie { background: var(--ostrzezenie-tlo); border-color: var(--ostrzezenie-linia); }
.baner.blad { background: #fbdada; border-color: #e2a0a0; color: #6b0f0f; }
:root[data-motyw='ciemny'] .baner.blad { background: #4c1d1d; border-color: #8a3a3a; color: #fecaca; }
.baner .tekst { flex: 1 1 240px; min-width: 0; }

.wiadomosci { list-style: none; margin: 0; padding: 0 16px 0 16px; display: grid; gap: 0; }
.wiad { border-top: 1px solid var(--linia); padding: 0; }
.wiad:first-child { border-top: 0; }
.wiad-naglowek { display: flex; align-items: flex-start; gap: 14px; padding: 14px 8px 8px 8px; cursor: pointer; border-radius: 10px; }
.wiad.zwinieta .wiad-naglowek { align-items: center; padding: 10px 8px; }
.wiad.zwinieta .wiad-naglowek:hover { background: var(--hover); }
.wiad-kto { flex: 1; min-width: 0; }
.wiad-kto b { font-size: 15px; }
.wiad-kto .adres { color: var(--tekst3); font-size: 13px; margin-left: 6px; }
.wiad-do { display: inline-flex; align-items: center; gap: 4px; color: var(--tekst2); font-size: 13px; margin-top: 2px; border-radius: 6px; padding: 1px 4px 1px 0; }
.wiad-do:hover { color: var(--tekst); }
.wiad-fragment { color: var(--tekst2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; min-width: 0; }
.wiad-prawa { display: flex; align-items: center; gap: 2px; color: var(--tekst2); font-size: 13px; white-space: nowrap; }
.wiad-prawa time { margin-right: 6px; }
.wiad-szczegoly { background: var(--powierzchnia-2); border: 1px solid var(--linia); border-radius: 12px; padding: 10px 14px; margin: 0 8px 8px 60px; display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; font-size: 13px; }
.wiad-szczegoly dt { color: var(--tekst3); text-align: right; } .wiad-szczegoly dd { margin: 0; overflow-wrap: anywhere; }
.wiad-cialo { padding: 0 8px 8px 62px; }
.wiad-ramka { width: 100%; border: 0; display: block; min-height: 60px; background: #fffdf8; border-radius: 10px; }
.wiad-ramka-opak { border-radius: 12px; border: 1px solid var(--linia); background: #fffdf8; overflow: hidden; }
.wiad-akcje { display: flex; gap: 8px; padding: 10px 0 4px; flex-wrap: wrap; }
.wiad-zal { padding: 6px 8px 14px 62px; display: grid; gap: 10px; }
.wiad-zal h4 { font-size: 13px; color: var(--tekst2); display: flex; align-items: center; gap: 8px; }
.zal-siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 10px; }
.zal-karta { border: 1.5px solid var(--linia2); border-radius: 12px; overflow: hidden; background: var(--powierzchnia); display: grid; text-align: left; transition: box-shadow .2s var(--ruch), border-color .2s; }
.zal-karta:hover { box-shadow: var(--cien-2); border-color: var(--tekst3); }
.zal-podglad { aspect-ratio: 3 / 2; background: var(--pole); display: grid; place-items: center; color: var(--tekst3); overflow: hidden; }
.zal-podglad img { width: 100%; height: 100%; object-fit: cover; }
.zal-podglad svg { width: 40px; height: 40px; }
.zal-opis { padding: 8px 10px; display: grid; gap: 1px; }
.zal-opis b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zal-opis small { color: var(--tekst3); }
.zal-ryzyko { color: var(--blad); font-weight: 700; font-size: 12px; }
.cytat-przycisk { margin: 4px 0; }

.szybka { margin: 8px 24px 12px 72px; padding: 14px; border: 1.5px solid var(--linia2); border-radius: 16px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; background: var(--powierzchnia-2); }
.szybka .btn { min-height: 44px; }
.szybka .podp { color: var(--tekst2); flex: 1 1 200px; }

/* panel boczny */
.panel-boczny .panel-gora { display: flex; align-items: center; justify-content: space-between; padding: 12px 8px 4px 20px; }
.panel-boczny h2 { font: 600 18px var(--font-display); }
.panel-tresc { flex: 1; overflow-y: auto; padding: 8px 20px 24px; display: grid; gap: 18px; align-content: start; }
.panel-tresc section { display: grid; gap: 8px; }
.panel-tresc h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--tekst3); font-weight: 700; }
.klient-glowa { display: flex; align-items: center; gap: 14px; }
.klient-glowa b { font-size: 17px; display: block; }
.klient-glowa small { color: var(--tekst2); overflow-wrap: anywhere; }
.dane-lista { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; }
.dane-lista dt { color: var(--tekst3); font-size: 13px; } .dane-lista dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.dane-lista dd.brak { color: var(--tekst3); font-weight: 400; }
.historia-lista, .notatki-lista, .dziennik-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.historia-lista a { display: grid; gap: 1px; padding: 8px 10px; border-radius: 10px; text-decoration: none; color: var(--tekst); border: 1px solid var(--linia); }
.historia-lista a:hover { background: var(--hover); }
.historia-lista small { color: var(--tekst3); }
.notatka { background: #fff3c4; color: #3d2f00; border-radius: 12px; padding: 10px 12px; display: grid; gap: 4px; box-shadow: var(--cien-1); }
:root[data-motyw='ciemny'] .notatka { background: #4a3d12; color: #fdf0b8; }
.notatka header { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; font-weight: 700; opacity: .85; }
.notatka p { white-space: pre-wrap; overflow-wrap: anywhere; }
.dziennik-lista li { font-size: 13px; color: var(--tekst2); display: flex; gap: 8px; }
.dziennik-lista time { color: var(--tekst3); white-space: nowrap; }
.ai-wynik { border: 1.5px solid color-mix(in oklab, var(--akcent) 45%, transparent); background: var(--akcent-tlo); border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; }
.ai-wynik h4 { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--akcent-link); }
.ai-wynik ul { margin: 0; padding-left: 18px; display: grid; gap: 3px; }
.ai-wynik .meta-ai { font-size: 12px; color: var(--tekst3); }
.ai-ladowanie { display: flex; align-items: center; gap: 10px; color: var(--tekst2); }
.ai-ladowanie::before { content: ''; width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid var(--linia2); border-top-color: var(--akcent); animation: obrot .8s linear infinite; }
@keyframes obrot { to { transform: rotate(360deg); } }
.szablon-poz { text-align: left; padding: 10px 12px; border: 1px solid var(--linia); border-radius: 12px; display: grid; gap: 2px; width: 100%; }
.szablon-poz:hover { background: var(--hover); border-color: var(--tekst3); }
.szablon-poz small { color: var(--tekst2); }

/* galeria załączników */
.galeria-pelna { position: fixed; inset: 0; z-index: 250; background: #000d; display: grid; grid-template-rows: auto 1fr auto; color: #fff; }
.galeria-pelna header { display: flex; align-items: center; gap: 12px; padding: 12px 16px; }
.galeria-pelna header b { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.galeria-pelna .scena { display: grid; place-items: center; padding: 8px 64px; min-height: 0; }
.galeria-pelna .scena img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; }
.galeria-pelna .strzalka { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border-radius: 50%; background: #fff2; color: #fff; display: grid; place-items: center; }
.galeria-pelna .strzalka:hover { background: #fff4; } .galeria-pelna .l { left: 12px; } .galeria-pelna .p { right: 12px; }
.galeria-pelna footer { padding: 10px 16px 16px; text-align: center; color: #ddd; }
.galeria-pelna .btn-ikona { color: #fff; } .galeria-pelna .btn-ikona:hover { background: #fff2; color: #fff; }
.zal-widok { padding: 18px 24px; overflow-y: auto; flex: 1; }
.zal-widok-siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.zal-widok .zal-karta .zal-podglad { aspect-ratio: 4 / 3; }

@media (max-width: 1099px) {
  .panel-pod { display: grid; gap: 12px; padding: 8px 16px 24px; }
  .panel-pod details { border: 1px solid var(--linia); border-radius: 14px; background: var(--powierzchnia-2); }
  .panel-pod summary { padding: 14px 16px; font-weight: 700; cursor: pointer; min-height: 48px; display: flex; align-items: center; }
  .panel-pod .panel-tresc { padding: 0 16px 16px; }
}
@media (min-width: 1100px) { .panel-pod { display: none; } }
@media (max-width: 719px) {
  .watek-naglowek { padding: 14px 16px 4px; } .watek-stan { padding: 4px 16px 10px; }
  .watek-temat { font-size: 21px; }
  .baner, .szybka { margin-left: 16px; margin-right: 16px; }
  .wiadomosci { padding: 0 6px; }
  .wiad-cialo, .wiad-zal { padding-left: 8px; }
  .wiad-szczegoly { margin-left: 8px; }
  .wiad-naglowek { gap: 10px; }
  .wiad-prawa time { display: none; }
  .zal-siatka { grid-template-columns: repeat(2, 1fr); }
  .szybka .btn { flex: 1 1 140px; }
}

.wiadomosci { grid-template-columns: minmax(0, 1fr); }
.wiad, .wiad-kto, .wiad-cialo { min-width: 0; }
.wiad-kto { overflow-wrap: anywhere; }
@media (max-width: 719px) { .wiad-kto b { display: inline; } .wiad-prawa { flex: none; } }