/* ═══ CENTRUM ZADAŃ NA DZIŚ — lista wszystkiego do ogarnięcia ═══ */
.dash-tasks {
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 20px;                 /* squircle — większe, gładkie zaokrąglenie */
  padding: 6px 0;                      /* tylko pion — wiersze na całą szerokość (inset list) */
  margin: 0 0 20px;
  box-shadow: 0 1px 2px rgba(15,23,42,.05), 0 12px 28px -16px rgba(15,23,42,.12);
}
.dt-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px 6px; }
/* Typografia: gruby, ciasny nagłówek (kontrast wag jak SF Pro) */
.dt-head-title { font-size: 1.15rem; font-weight: 800; color: #1d2a3a; letter-spacing: -.03em; }
.dt-subhead {
  font-size: .78rem; line-height: 1.45; color: #98a0ad;
  padding: 0 18px 8px;
  border-bottom: none;
}
.dt-subhead svg {
  width: 13px !important; height: 13px !important;
  stroke: #95c11f; fill: none; vertical-align: -2px; margin: 0 1px;
}
.dt-head-count {
  min-width: 26px; height: 26px; padding: 0 8px;
  background: #1d2a3a; color: #fff; border-radius: 13px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .82rem; font-weight: 800; font-variant-numeric: tabular-nums;
}
.dt-group-label {
  font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: #a0a6b0; padding: 14px 18px 6px;
}
.dt-gl-urgent { color: #c34a3d; }
/* Opakowanie swipe — kryje tło akcji, separator wcięty do tekstu (iOS) */
.dt-swipe { position: relative; overflow: hidden; }
.dt-swipe:not(:last-child)::after {
  content: ''; position: absolute; left: 56px; right: 0; bottom: 0;
  height: 0.5px; background: rgba(60,60,67,.13); z-index: 2;
}
/* Tło akcji „Zadzwoń" — odsłaniane przy przesunięciu w prawo */
.dt-sw-bg {
  position: absolute; inset: 0; z-index: 0;
  display: flex; align-items: center; gap: 9px;
  padding-left: 24px;
  background: #34c759;            /* iOS green */
  color: #fff; font-weight: 700; font-size: .9rem;
}
.dt-sw-bg svg { width: 21px !important; height: 21px !important; stroke: #fff; fill: none; stroke-width: 1.9; }
.dt-swipe.sw-armed .dt-sw-bg { background: #28a745; }
/* Wiersz listy iOS — przesuwalna, nieprzezroczysta warstwa na wierzchu */
.dt-row {
  position: relative; z-index: 1;
  background: #fff;
  display: flex; align-items: center; gap: 14px;
  padding: 12px 18px; cursor: pointer;
  transition: background .12s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-y;           /* poziomy gest obsługujemy sami */
  will-change: transform;
}
.dt-row:active { background: #ececf1; }
/* Ikona: cienka, monochromatyczna, BEZ kolorowego kwadratu — „oddycha" (SF Symbols style) */
.dt-ico {
  width: 26px; height: 26px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: transparent; color: #3a4150;
}
.dt-ico svg { width: 23px !important; height: 23px !important; stroke: currentColor; fill: none; stroke-width: 1.6; }
/* Ikona ZAWSZE neutralna (monochromia SF) — stan niesie kropka, nie kolor ikony */
.dt-urgent .dt-ico, .dt-today .dt-ico { color: #3a4150; }
.dt-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dt-name { font-size: .96rem; font-weight: 600; color: #1d2a3a; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Linia statusu z kropką stanu — 1:1 jak wiersz CRM */
.dt-action { display: flex; align-items: center; gap: 7px; min-width: 0; font-size: .8rem; color: #8b94a3; }
.dt-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; background: #b0b6c0; }
.dt-action-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dt-urgent .dt-dot { background: #e0584a; }
.dt-today  .dt-dot { background: #95c11f; }
.dt-urgent .dt-action-txt { color: #b04a3f; }
/* Przycisk telefonu — squircle, STONOWANA zieleń (nie ściana jaskrawej zieleni) */
/* Telefon — surowy, cienki symbol słuchawki (zielony akcent akcji, bez koła) */
.dt-call {
  width: 40px; height: 40px; flex-shrink: 0; color: #5a8a1e;
  background: transparent; display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: opacity .15s, transform .1s;
}
.dt-call svg { width: 22px !important; height: 22px !important; stroke: #5a8a1e !important; fill: none !important; stroke-width: 1.6 !important; }
.dt-call:active { transform: scale(.9); opacity: .6; }
.dt-row.dt-start .dt-call:active { opacity: .6; }
.dt-chev { color: #c4c4cc; flex-shrink: 0; display: flex; align-items: center; }
/* Cienki chevron (SF Symbol chevron.right) — tylko sygnał klikalności */
.row-chev { width: 15px !important; height: 15px !important; stroke: currentColor; fill: none; opacity: .9; }
.cal-today-tasks { margin-bottom: 20px; }

/* ── Filtry kalendarza — karta z przełącznikami (zaznacz co pokazać) ── */
.cal-filter-head {
  font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: #a0a6b0; margin: 0 4px 8px;
}
.cal-legend-card {
  background: #fff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  padding: 4px 0;
  margin: 0 0 16px;
  overflow: hidden;
}
.cll-row {
  position: relative; display: flex; align-items: center; gap: 12px;
  width: 100%; padding: 13px 18px;
  background: transparent; border: 0; cursor: pointer; font-family: inherit; text-align: left;
  -webkit-tap-highlight-color: transparent; transition: background .12s;
}
.cll-row:active { background: #f3f3f7; }
.cll-row:not(:last-child)::after {
  content: ''; position: absolute; left: 42px; right: 0; bottom: 0;
  height: 0.5px; background: rgba(60,60,67,.13);
}
.cll-dot { width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; transition: opacity .15s; }
.cll-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; transition: opacity .15s; }
.cll-name { font-size: .92rem; font-weight: 600; color: #1d2a3a; letter-spacing: -.01em; }
.cll-sub { font-size: .78rem; color: #8b94a3; }
/* przełącznik (checkbox iOS) */
.cll-check {
  margin-left: auto; flex-shrink: 0;
  width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid #d1d5db; background: #fff;
  position: relative; transition: background .15s, border-color .15s;
}
.cll-row.on .cll-check { background: #34c759; border-color: #34c759; }
.cll-row.on .cll-check::after {
  content: ''; position: absolute; left: 7px; top: 3.5px;
  width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
/* wyłączony filtr — przygaszony wiersz */
.cll-row:not(.on) .cll-dot, .cll-row:not(.on) .cll-txt { opacity: .38; }

/* ═══ Menu kontekstowe (Haptic Touch) — blur tła + szklane menu + spring ═══ */
.ctx-overlay { position: fixed; inset: 0; z-index: 9000; }
.ctx-backdrop {
  position: absolute; inset: 0;
  background: rgba(10,14,20,.18);
  -webkit-backdrop-filter: blur(16px) saturate(120%); backdrop-filter: blur(16px) saturate(120%);
  opacity: 0; transition: opacity .24s ease;
}
.ctx-overlay.show .ctx-backdrop { opacity: 1; }
.ctx-stage {
  position: absolute; width: 256px; max-width: calc(100vw - 24px);
  display: flex; flex-direction: column; gap: 12px;
  transform: scale(.86); opacity: 0; transform-origin: top left;
  transition: transform .34s cubic-bezier(.2,1.28,.3,1), opacity .2s ease;
}
.ctx-overlay.show .ctx-stage { transform: scale(1); opacity: 1; }
.ctx-preview {
  background: #fff; border-radius: 16px; padding: 14px 16px;
  box-shadow: 0 30px 70px -16px rgba(0,0,0,.42);
}
.ctx-prev-name { font-weight: 700; font-size: .98rem; color: #1d2a3a; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctx-prev-sub { font-size: .8rem; color: #8b94a3; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctx-menu {
  background: rgba(250,250,252,.82);
  -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%);
  border-radius: 14px; overflow: hidden;
  box-shadow: 0 18px 50px -10px rgba(0,0,0,.34);
}
.ctx-item {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  width: 100%; padding: 14px 16px;
  background: transparent; border: 0; cursor: pointer; font-family: inherit;
  font-size: .96rem; font-weight: 500; color: #1d2a3a; text-align: left;
  -webkit-tap-highlight-color: transparent;
}
.ctx-item:active { background: rgba(0,0,0,.06); }
.ctx-item svg { width: 19px !important; height: 19px !important; stroke: currentColor; fill: none; stroke-width: 1.6; flex-shrink: 0; }
.ctx-sep { height: 0.5px; background: rgba(60,60,67,.16); }
.ctx-danger { color: #e30613; }

/* „ZACZNIJ TUTAJ" — najważniejsza rzecz, od czego zacząć */
.dt-row.dt-start {
  flex-wrap: wrap;
  background: #f4f9e8;
  border: 1px solid #d9ebb3;
  padding: 14px 10px;
  margin-bottom: 6px;
}
.dt-row.dt-start:hover { background: #eef6da; }
.dt-start-tag {
  flex-basis: 100%;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .09em;
  color: #5a8a1e;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.dt-start-tag::before {
  content: '';
  width: 7px; height: 7px; border-radius: 50%;
  background: #95c11f;
  box-shadow: 0 0 0 3px rgba(149,193,31,.25);
}
.dt-row.dt-start .dt-name { font-weight: 800; }
.dt-empty {
  display: flex; align-items: center; gap: 12px; padding: 10px 6px 14px;
}
.dt-empty svg { width: 32px !important; height: 32px !important; stroke: #16a34a; fill: none; flex-shrink: 0; }
.dt-empty b { display: block; font-size: .92rem; color: #1d2a3a; }
.dt-empty span { font-size: .8rem; color: #6b7280; }

/* Karta „czekamy na akceptację" + widoczny przycisk ponownej wysyłki */
.ld-waiting-card {
  background: linear-gradient(135deg, #fffbeb, #fef3c7);
  border: 1px solid #fcd34d;
  border-radius: 14px;
  padding: 14px;
}
.lw-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.lw-ico {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  background: rgba(217,119,6,.15); color: #b45309;
  display: flex; align-items: center; justify-content: center;
}
.lw-ico svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; }
.lw-title { font-size: .92rem; font-weight: 700; color: #92400e; letter-spacing: -.01em; }
.lw-sub { font-size: .78rem; color: #a16207; margin-top: 3px; line-height: 1.4; }
.lw-resend {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 12px; border: 0; border-radius: 10px;
  background: #1d2a3a; color: #fff;
  font-size: .9rem; font-weight: 600; cursor: pointer; font-family: inherit;
  transition: all .15s; -webkit-tap-highlight-color: transparent;
}
.lw-resend svg { width: 18px !important; height: 18px !important; stroke: #fff; fill: none; }
.lw-resend:hover { background: #243447; }
.lw-resend:active { transform: scale(.98); }

/* Chip przypomnienia na karcie leada */
.lead-reminder-chip {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 8px; padding: 6px 10px;
  background: #eff6ff; color: #1e40af;
  border: 1px solid #bfdbfe; border-radius: 8px;
  font-size: .74rem; font-weight: 600; line-height: 1.3;
}
.lead-reminder-chip.overdue { background: #fef2f2; color: #b91c1c; border-color: #fecaca; }
.lead-reminder-chip svg { width: 14px !important; height: 14px !important; fill: currentColor; flex-shrink: 0; }
.lead-reminder-chip b { font-weight: 800; }

/* ===== NOTATKI + PRZYPOMNIENIA przy leadzie ===== */
.ld-notes-composer {
  background: #f9fafb;
  border: 1px solid #f0f1f3;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 14px;
}
.ld-note-remind { margin-top: 10px; }
.ld-note-remind-toggle {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .82rem; font-weight: 600; color: #4b5563; cursor: pointer;
  background: none; border: 0; padding: 4px 0; font-family: inherit; text-align: left;
  -webkit-tap-highlight-color: transparent;
}
.ld-nrt-box {
  width: 22px; height: 22px; flex-shrink: 0;
  border-radius: 6px; border: 2px solid #cbd5e1; background: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, border-color .15s;
}
.ld-nrt-box svg { width: 14px !important; height: 14px !important; opacity: 0; transition: opacity .12s; }
.ld-nrt-box.checked { background: #95c11f; border-color: #95c11f; }
.ld-nrt-box.checked svg { opacity: 1; }
.ld-nrt-label { display: inline-flex; align-items: center; gap: 6px; }
.ld-nrt-label svg { width: 15px !important; height: 15px !important; stroke: #6b7280; fill: none; }
.ld-nrt-label em { color: #9ca3af; font-style: normal; font-weight: 500; font-size: .76rem; }
.ld-note-remind-wrap { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.ld-note-quick { display: flex; gap: 6px; }
.ld-note-quick button {
  flex: 1; padding: 7px; font-size: .78rem; font-weight: 600;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 8px;
  color: #1d2a3a; cursor: pointer; font-family: inherit;
}
.ld-note-quick button:hover { border-color: #95c11f; background: #f0fdf4; }

.ld-notes-empty { text-align: center; padding: 24px 16px; color: #9ca3af; font-size: .85rem; line-height: 1.5; }
.ld-notes-list { display: flex; flex-direction: column; gap: 10px; }
.ld-note-item {
  position: relative;
  background: #fff; border: 1px solid #f0f1f3; border-radius: 12px;
  padding: 12px 36px 12px 14px;
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
}
/* Notatka właściciela — wyróżniona */
.ld-note-item.note-owner { border-left: 3px solid #f59e0b; background: #fffdf7; }
.note-owner-badge {
  display: inline-block; font-size: .56rem; font-weight: 800; letter-spacing: .06em;
  color: #fff; background: linear-gradient(135deg,#f59e0b,#d97706);
  padding: 2px 6px; border-radius: 5px; vertical-align: 1px;
}
/* Przypomnienia — kolor wg stanu */
.ld-note-item.rem-pending { border-left: 3px solid #2196f3; }
.ld-note-item.rem-overdue { border-left: 3px solid #e30613; background: #fef2f2; }
.ld-note-item.rem-done { opacity: .6; }
.ld-note-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.ld-note-author { font-size: .75rem; font-weight: 700; color: #1d2a3a; }
.ld-note-date { font-size: .68rem; color: #9ca3af; flex-shrink: 0; }
.ld-note-body { font-size: .88rem; color: #374151; line-height: 1.45; white-space: pre-wrap; }
.ld-note-reminder { margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e5e7eb; }
/* Info: kiedy przypomnieć (osobno od akcji) */
.ldn-rem-info {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .74rem; font-weight: 600; color: #6b7280;
  margin-bottom: 8px;
}
.ldn-rem-info svg { width: 14px !important; height: 14px !important; stroke: currentColor; fill: none; }
.ldn-rem-info.is-overdue { color: #b91c1c; }
/* Wyraźny przycisk odhaczania przypomnienia */
.ld-note-done-btn {
  display: inline-flex; align-items: center; gap: 10px;
  width: 100%; padding: 9px 12px;
  background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 10px;
  cursor: pointer; font-family: inherit; text-align: left;
  transition: all .15s; -webkit-tap-highlight-color: transparent;
}
.ld-note-done-btn:active { transform: scale(.98); }
.ld-note-done-btn.is-overdue { background: #fef2f2; border-color: #fecaca; }
.ld-note-done-btn.is-done { background: #f0fdf4; border-color: #bbf7d0; }
.ld-note-done-btn .ldn-check {
  width: 22px; height: 22px; flex-shrink: 0; border-radius: 6px;
  border: 2px solid #93c5fd; background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.ld-note-done-btn.is-overdue .ldn-check { border-color: #fca5a5; }
.ld-note-done-btn.is-done .ldn-check { background: #16a34a; border-color: #16a34a; }
.ld-note-done-btn .ldn-check svg { width: 14px !important; height: 14px !important; fill: #fff; stroke: #fff; }
.ld-note-done-btn .ldn-rem-text { font-size: .78rem; font-weight: 700; color: #1e40af; }
.ld-note-done-btn.is-overdue .ldn-rem-text { color: #b91c1c; }
.ld-note-done-btn.is-done .ldn-rem-text { color: #16a34a; text-decoration: line-through; }
.ld-note-del {
  position: absolute; top: 8px; right: 8px;
  width: 26px; height: 26px; border: 0; background: transparent;
  color: #cbd5e1; cursor: pointer; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
}
.ld-note-del:hover { background: #fef2f2; color: #e30613; }
.ld-note-del svg { width: 14px !important; height: 14px !important; fill: currentColor; }
/* Kropka na tabie Notatki gdy są aktywne przypomnienia */
.ld-tab-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #e30613; margin-left: 5px; vertical-align: 1px; }

/* ===== ZGODA RODO ===== */
.rodo-overlay {
  position: fixed;
  inset: 0;
  z-index: 100001;
  background: rgba(15,23,42,.75);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.rodo-card {
  background: #fff;
  border-radius: 22px;
  padding: 26px 22px 20px;
  max-width: 440px;
  width: 100%;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow: 0 30px 60px rgba(0,0,0,.4);
  text-align: center;
  font-family: 'Inter', -apple-system, sans-serif;
}
.rodo-ico {
  width: 56px; height: 56px;
  margin: 0 auto 14px;
  border-radius: 16px;
  background: rgba(149,193,31,.14);
  color: #5a7811;
  display: flex; align-items: center; justify-content: center;
}
.rodo-ico svg { width: 28px; height: 28px; stroke: currentColor; fill: none; }
.rodo-title { font-size: 1.3rem; font-weight: 800; color: #1d2a3a; letter-spacing: -.02em; }
.rodo-sub { font-size: .82rem; color: #6b7280; margin-top: 2px; margin-bottom: 16px; }
.rodo-body { text-align: left; }
.rodo-body p { font-size: .86rem; color: #374151; line-height: 1.55; margin-bottom: 12px; }
.rodo-points { list-style: none; padding: 0; margin: 0 0 14px; }
.rodo-points li {
  font-size: .8rem; color: #4b5563; line-height: 1.4;
  padding: 6px 0 6px 22px; position: relative;
}
.rodo-points li::before {
  content: ''; position: absolute; left: 4px; top: 11px;
  width: 6px; height: 6px; border-radius: 50%; background: #95c11f;
}
.rodo-check {
  display: flex; gap: 11px; align-items: flex-start; text-align: left;
  width: 100%; font-family: inherit;
  font-size: .82rem; color: #1d2a3a; line-height: 1.4;
  padding: 14px; background: #f9fafb; border: 1px solid #eef0f3; border-radius: 12px; cursor: pointer;
  margin-bottom: 16px;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s, border-color .15s;
}
.rodo-check:active { background: #f1f5f9; }
.rodo-box {
  width: 24px; height: 24px; flex-shrink: 0; margin-top: 0;
  border-radius: 7px; border: 2px solid #cbd5e1; background: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, border-color .15s;
}
.rodo-box svg { width: 15px !important; height: 15px !important; opacity: 0; transition: opacity .12s; }
.rodo-box.checked { background: #95c11f; border-color: #95c11f; }
.rodo-box.checked svg { opacity: 1; }
.rodo-check-txt { flex: 1; }

/* Linki prawne (Polityka / Regulamin / Usuwanie danych) */
.rodo-legal, .profile-legal {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-top: 12px; font-size: .78rem; flex-wrap: wrap;
}
.profile-legal { margin-bottom: 6px; }
.rodo-legal a, .profile-legal a { color: #5a8a1e; font-weight: 600; text-decoration: none; }
.rodo-legal a:active, .profile-legal a:active { text-decoration: underline; }
.rodo-legal span, .profile-legal span { color: #cbd5e1; }

/* ── Przełącznik powiadomień push (profil) ── */
.push-toggle {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 15px 16px; margin-bottom: 10px;
  background: #ffffff; border: 0.5px solid rgba(60,60,67,.10); border-radius: 16px;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  cursor: pointer; font-family: inherit; text-align: left;
  -webkit-tap-highlight-color: transparent; transition: background .15s;
}
.push-toggle:active { transform: none; background: #fafafc; }
.push-toggle .ptb-ico {
  width: 30px; height: 30px; border-radius: 0; flex-shrink: 0;
  background: transparent; color: #3a4150;
  display: inline-flex; align-items: center; justify-content: center;
}
.push-toggle .ptb-ico svg { width: 24px !important; height: 24px !important; stroke: currentColor; fill: none; stroke-width: 1.6; }
.ptb-text { flex: 1; min-width: 0; }
.ptb-label { display: block; font-size: .9rem; font-weight: 700; color: #1d2a3a; }
.ptb-sub { display: block; font-size: .76rem; color: #6b7280; margin-top: 2px; }
.ptb-state {
  width: 44px; height: 26px; border-radius: 999px; flex-shrink: 0;
  background: #cbd5e1; position: relative; transition: background .18s;
}
.ptb-state::after {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 20px; height: 20px; border-radius: 50%; background: #fff;
  transition: transform .18s; box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.push-toggle.on { background: #ffffff; border-color: rgba(60,60,67,.10); }
.push-toggle.on .ptb-ico { background: transparent; color: #5a8a1e; }
.push-toggle.on .ptb-state { background: #95c11f; }
.push-toggle.on .ptb-state::after { transform: translateX(18px); }
.rodo-accept {
  width: 100%; padding: 14px; border: 0; border-radius: 12px;
  background: #95c11f; color: #1d2a3a;
  font-size: 1rem; font-weight: 700; cursor: pointer; font-family: inherit;
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14); transition: all .15s;
}
.rodo-accept:disabled { opacity: .45; cursor: default; box-shadow: none; }
.rodo-accept:not(:disabled):hover { box-shadow: 0 8px 22px rgba(149,193,31,.5); }
.rodo-decline {
  width: 100%; padding: 11px; margin-top: 8px;
  background: transparent; border: 0; color: #9ca3af;
  font-size: .82rem; font-weight: 600; cursor: pointer; font-family: inherit;
}
.rodo-decline:hover { color: #6b7280; }

/* Statystyki ambasadorów — wiersze z aktywnością */
.os-row-rich { align-items: flex-start; padding: 12px 0; }
.os-row-rich .sl-avatar { position: relative; }
.os-live {
  position: absolute; bottom: -1px; right: -1px;
  width: 11px; height: 11px; border-radius: 50%;
  background: #22c55e; border: 2px solid #fff;
}
.os-activity { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 4px; align-items: center; }
.os-last { font-size: .72rem; font-weight: 600; color: #6b7280; }
.os-last.is-live { color: #16a34a; }
.os-fns { font-size: .72rem; color: #9ca3af; }

/* Klikalny wiersz ambasadora */
button.os-row-rich {
  display: flex; align-items: center; gap: 12px; width: 100%;
  background: #fff; border: 1px solid #f0f1f3; border-radius: 14px;
  padding: 12px 14px; margin-bottom: 8px; cursor: pointer; text-align: left;
  font-family: inherit; transition: all .15s; -webkit-tap-highlight-color: transparent;
}
button.os-row-rich:hover { border-color: #95c11f; box-shadow: 0 2px 10px rgba(149,193,31,.12); }
button.os-row-rich:active { transform: scale(.99); }
button.os-row-rich .sl-info { flex: 1; min-width: 0; }
.os-chevron { color: #cbd5e1; font-size: 1.4rem; flex-shrink: 0; }

/* Oś czasu aktywności ambasadora */
#ambActivityModal .modal-sheet { z-index: 721; }
.amb-act-list { max-height: 60vh; overflow-y: auto; margin: 8px 0 14px; }
.amb-act-row { display: flex; gap: 12px; padding: 8px 0; align-items: flex-start; }
.amb-act-dot {
  width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; flex-shrink: 0;
}
.amb-act-dot.page { background: #cbd5e1; }
.amb-act-dot.act { background: #95c11f; box-shadow: 0 0 0 3px rgba(149,193,31,.15); }
.amb-act-body { flex: 1; min-width: 0; }
.amb-act-name { font-size: .88rem; font-weight: 600; color: #1d2a3a; }
.amb-act-detail { font-weight: 400; color: #9ca3af; }
.amb-act-time { font-size: .72rem; color: #9ca3af; margin-top: 1px; }

/* ===== DiBO Ambasador PWA — Brand Styles (motyw ambasadordibo.pl) ===== */
:root {
  --primary: #1d2a3a;         /* DiBO granat — header, dark buttons */
  --primary-light: #243447;
  --accent: #95c11f;          /* DiBO zielony — główny akcent brandu */
  --accent-hover: #7cb342;
  --danger: #e30613;          /* DiBO czerwień — pilne / niebezpieczne akcje */
  --danger-hover: #b8050f;
  --green: #95c11f;           /* alias do brand green */
  --green-light: #ecf5d8;
  --orange: #f39c12;
  --blue: #95c11f;            /* alias zachowany — przemapowany na brand green */
  --purple: #8b5cf6;
  --bg: #f2f2f7;              /* iOS systemGray6 — natywne tło, karty białe odcinają się czysto */
  --card: #ffffff;            /* czysta biel — karty */
  --text: #09090b;            /* nie czysty czarny — głęboki grafit */
  --text-light: #6b7280;      /* gray-500 dla podtytułów */
  --text-muted: #9ca3af;      /* gray-400 dla nagłówków sekcji */
  --border: #f3f4f6;          /* gray-100 — ledwo widoczna */
  --border-strong: #e5e7eb;   /* gray-200 — gdy potrzeba mocniejszej */
  /* Apple-style soft system shadows */
  --shadow: 0 1px 3px rgba(15,23,42,.04), 0 1px 2px rgba(15,23,42,.02);
  --shadow-lg: 0 8px 24px rgba(15,23,42,.08), 0 2px 6px rgba(15,23,42,.04);

  /* RADIUS TOKENS — hierarchia (button < karta < hero) */
  --r-xs: 6px;     /* chip, tag */
  --r-sm: 10px;    /* standardowy przycisk, mała karta */
  --r-md: 14px;    /* karta wewnętrzna, input */
  --r-lg: 18px;    /* główna karta */
  --r-xl: 24px;    /* hero card, modal */
  --radius: 18px;       /* legacy alias = r-lg */
  --radius-sm: 10px;    /* legacy alias = r-sm */

  /* PADDING TOKENS — siatka 4px */
  --p-chip: 6px 10px;
  --p-btn: 10px 16px;
  --p-btn-lg: 14px 22px;
  --p-card: 20px;
  --p-hero: 24px;

  /* BORDER — modern premium = 1px ledwo widoczny */
  --card-border: 1px solid #f3f4f6;
  --nav-height: 58px;
  --header-height: 56px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 15px;
  color: var(--text);
  /* Granat pod statusem/notchem — strefa overscroll na górze nie błyska na biało */
  background: #1d2a3a;
  -webkit-tap-highlight-color: transparent;
  overflow-x: hidden;
  /* Native feel: brak elastycznego odbicia (rubber-band) i pull-to-refresh */
  overscroll-behavior: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
}

/* ── 2-KROKOWY FLOW (Zadzwoń → wpisz termin) — elegancki, jasny ── */
.ld-two-step {
  background: #ffffff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 16px;
  padding: 18px;
  box-shadow: none;
  margin-bottom: 10px;
}
.ld-two-step-hdr {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 14px;
  padding: 0 4px;
}
.ld-two-step-label {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9ca3af;
}
.ld-two-step-help {
  font-size: .82rem;
  font-weight: 600;
  color: #1d2a3a;
  letter-spacing: -.01em;
}

.ld-step {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.ld-step-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #1d2a3a;
  color: #ffffff;
  font-size: .82rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.ld-step-body { flex: 1; min-width: 0; }
.ld-step-title {
  font-size: .92rem;
  font-weight: 700;
  color: #1d2a3a;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.ld-step-desc {
  font-size: .76rem;
  color: #6b7280;
  margin-top: 2px;
  font-weight: 500;
}
.ld-step-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
  padding: 12px 16px;
  border-radius: 10px;
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: -.005em;
  text-decoration: none;
  cursor: pointer;
  transition: all .15s ease;
  font-family: inherit;
  border: 0;
}
.ld-step-cta svg { width: 18px !important; height: 18px !important; stroke: currentColor; fill: none; stroke-width: 1.8; flex-shrink: 0; }
.ld-step-cta-primary {
  background: #95c11f;
  color: #1d2a3a;
  box-shadow: 0 4px 14px rgba(149,193,31,.3);
}
.ld-step-cta-primary:hover { background: #7cb342; box-shadow: 0 6px 18px rgba(149,193,31,.4); }
.ld-step-cta-primary:active { transform: scale(.98); }
.ld-step-cta-secondary {
  background: #f9fafb;
  color: #1d2a3a;
  border: 1px solid #e5e7eb;
  box-shadow: none;
}
.ld-step-cta-secondary:hover { background: #f3f4f6; border-color: #d1d5db; }
.ld-step-cta-secondary:active { transform: scale(.98); }

.ld-step-divider {
  height: 1px;
  background: #f3f4f6;
  margin: 16px 0;
  margin-left: 40px;        /* aligned with step body */
  position: relative;
}
.ld-step-divider::after {
  content: '';
  position: absolute;
  left: -32px;              /* zostaw przerwę przy numerze */
  top: -10px;
  bottom: -10px;
  width: 2px;
  background: linear-gradient(180deg, #1d2a3a, #1d2a3a);
  opacity: .15;
}

/* ── Owner badge — "TYLKO WŁAŚCICIEL" plakietka ───────────── */
.owner-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  color: #ffffff;
  border-radius: 999px;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(245,158,11,.3);
  flex-shrink: 0;
}
.owner-badge svg {
  width: 11px !important;
  height: 11px !important;
  stroke: currentColor;
  fill: none;
}
/* Mini variant — sama ikona kłódki bez tekstu (na przyciskach) */
.owner-badge-mini {
  padding: 3px;
  gap: 0;
  width: 18px;
  height: 18px;
  justify-content: center;
}
.owner-badge-mini svg { width: 9px !important; height: 9px !important; }

/* SVG global default — Apple/Lucide line icon style */
svg {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  display: inline-block;
  vertical-align: middle;
}
/* Outline icons (default) — dziedziczą kolor przez stroke */
svg[stroke="currentColor"] { stroke: currentColor; }
svg[fill="currentColor"] { fill: currentColor; }
/* SVG które jawnie deklarują width/height → auto */
svg[width] { width: auto; }
svg[height] { height: auto; }

body {
  min-height: 100dvh;
  /* Jasne tło treści (html zostaje granat — pokazuje się tylko w strefie notcha/overscroll) */
  background: var(--bg);
  /* Blokada odbicia na poziomie dokumentu (działa w trybie standalone PWA) */
  overscroll-behavior: none;
  padding-bottom: calc(var(--nav-height) + var(--safe-bottom) + 8px);
}
/* Gwarantowane granatowe wypełnienie strefy statusu/notcha (Dynamic Island).
   Na urządzeniach bez notcha env() = 0 → pasek ma wysokość 0 i jest niewidoczny. */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0;
  height: env(safe-area-inset-top, 0px);
  background: #1d2a3a;
  z-index: 99;
  pointer-events: none;
}

/* ===== Header — Apple navigation bar style ===== */
.app-header {
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: calc(var(--header-height) + env(safe-area-inset-top, 0px));
  padding: env(safe-area-inset-top, 0px) max(18px, env(safe-area-inset-right, 0px)) 0 max(18px, env(safe-area-inset-left, 0px));
  background: #1d2a3a;
  color: #fff;
  border-bottom: 0;
  box-shadow: none;
}

.app-header .logo {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
}

.app-header .logo-img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: contain;
  background: #fff;
  padding: 2px;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
}

.app-header .logo-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  line-height: 1;
}
.app-header .logo-title {
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .12em;
  color: #fff;
  text-transform: uppercase;
}
.app-header .logo-dibo {
  color: #95c11f;
  font-weight: 900;
  letter-spacing: -.01em;
}
.app-header .logo-tagline {
  font-size: .65rem;
  color: rgba(255,255,255,.55);
  letter-spacing: .08em;
  font-weight: 600;
}

/* Prawa strona nagłówka — badge planu + profil */
.app-header .ah-right { display: flex; align-items: center; gap: 9px; }
.ah-plan {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px;
  background: #f4f6f9;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 999px;
  color: #1d2a3a;
  font-size: .72rem; font-weight: 800;
  letter-spacing: .01em;
  cursor: pointer; font-family: inherit;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  transition: background .15s, transform .1s;
  -webkit-tap-highlight-color: transparent;
  white-space: nowrap;
}
.ah-plan:active { transform: scale(.97); }
.ah-plan:hover { background: #fff; }
.ah-plan svg { width: 13px !important; height: 13px !important; stroke: #6ba80f; fill: #95c11f; flex-shrink: 0; }
.gpb-btn { display: inline-flex; align-items: center; gap: 6px; }
.gpb-btn svg { width: 15px !important; height: 15px !important; stroke: currentColor; fill: none; flex-shrink: 0; }
.app-header button.user-avatar { padding: 0; font-family: inherit; }
/* Wąskie ekrany — skróć badge planu do samej kropki + „Test" */
@media (max-width: 360px) { .ah-plan-txt { display: none; } .ah-plan { padding: 7px; } }

/* Avatar w nagłówku — minimalistyczny, zgodny z granatem tła */
.app-header .user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.9);
  cursor: pointer;
  transition: all .15s ease;
  font-weight: 600;
  font-size: .85rem;
}
.app-header .user-avatar:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.25);
}
.app-header .user-avatar:active {
  transform: scale(.94);
}

/* ═══════════════════════════════════════════════════════════════
   CRM LEAD CARD — banner akceptacji (BIG, premium, pulsujący)
   ═══════════════════════════════════════════════════════════════ */

/* Karta zaakceptowana — subtelny zielony border-left (shadcn-style) */
.lead-card.lead-accepted {
  border: 1px solid hsl(240 5.9% 90%);
  border-left: 3px solid #95c11f;
  background: hsl(0 0% 100%);
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
.lead-card.lead-accepted .lead-row-main,
.lead-card.lead-accepted .lead-cta-row,
.lead-card.lead-accepted .lead-strip {
  background: hsl(0 0% 100%);
}

/* Banner akceptacji — subtelny (nie pełnokolorowy) */
.lead-accepted-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgb(149 193 31 / .08);
  color: #5a7811;
  padding: 10px 24px;
  margin: 0;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-bottom: 1px solid hsl(240 5.9% 90%);
}
.lead-accepted-banner .lab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #95c11f;
  color: #ffffff;
  font-weight: 700;
  font-size: .7rem;
  flex-shrink: 0;
}
.lead-accepted-banner .lab-icon svg { width: 12px; height: 12px; stroke: #ffffff; fill: none; stroke-width: 2.5; }
.lead-accepted-banner .lab-text {
  flex: 1;
  min-width: 0;
}
.lead-accepted-banner .lab-text b {
  font-weight: 900;
  letter-spacing: .03em;
}
@keyframes leadAccPulse {
  0%, 100% { box-shadow: 0 2px 8px -2px rgba(15,23,42,.14); }
  50%      { box-shadow: 0 6px 20px rgba(149,193,31,.55), 0 0 0 4px rgba(149,193,31,.18); }
}

/* ── Status info banner — pokazuje co aktualnie dzieje się na etapie ── */
/* Premium, spójny baner stanu — czysta biała karta + akcent po lewej + kolorowa ikona */
.ld-status-info {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  margin-bottom: 18px;
  background: #f8fafc;
  border: none;
  border-left: 3px solid #cbd5e1;
  box-shadow: none;
}
.ld-status-info .ldb-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 0.625rem;
  flex-shrink: 0;
  background: #f1f5f9;
  color: #64748b;
}
.ld-status-info .ldb-ico svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; stroke-width: 1.7; }
.ld-status-info .ldb-title {
  font-size: .92rem;
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1.25;
  color: #1d2a3a;
}
.ld-status-info .ldb-sub {
  font-size: .78rem;
  margin-top: 3px;
  font-weight: 500;
  color: #6b7280;
}
.ld-status-info .ldb-body { flex: 1; min-width: 0; }
.ld-status-info .ldb-action {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  color: #6b7280;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.ld-status-info .ldb-action svg { width: 18px !important; height: 18px !important; stroke: currentColor; fill: none; stroke-width: 1.8; }
.ld-status-info .ldb-action:hover { background: #f3f4f6; color: #1d2a3a; }
.ld-status-info .ldb-action:active { transform: scale(.95); }

/* Stany — tylko akcent (lewy pasek + ikona), karta zostaje biała = premium */
.ld-status-info.status-accepted { border-left-color: #95c11f; }
.ld-status-info.status-accepted .ldb-ico { background: rgba(149,193,31,.14); color: #5a7811; }
.ld-status-info.status-waiting  { border-left-color: #f59e0b; }
.ld-status-info.status-waiting .ldb-ico { background: rgba(245,158,11,.14); color: #b45309; }
.ld-status-info.status-action   { border-left-color: #2563eb; }
.ld-status-info.status-action .ldb-ico { background: rgba(37,99,235,.1); color: #2563eb; }
.ld-status-info.status-info     { border-left-color: #cbd5e1; }
.ld-status-info.status-pool     { border-left-color: #95c11f; }
.ld-status-info.status-pool .ldb-ico { background: rgba(149,193,31,.14); color: #5a7811; }
.ld-status-info.status-urgent   { border-left-color: #e30613; }
.ld-status-info.status-urgent .ldb-ico { background: rgba(227,6,19,.1); color: #e30613; }
.ld-status-info.status-urgent .ldb-title { color: #b91c1c; }
.ld-status-info.status-done     { border-left-color: #95c11f; }
.ld-status-info.status-done .ldb-ico { background: rgba(149,193,31,.14); color: #5a7811; }
.ld-status-info.status-lost     { border-left-color: #cbd5e1; }
.ld-status-info.status-lost .ldb-title { color: #6b7280; }

/* Blok ponownej wysyłki — minimalny, premium (bez żółtej skrzyni) */
.ld-resend-block {
  background: #f9fafb;
  border: 1px solid #eef0f3;
  border-radius: 14px;
  padding: 14px;
}
.ld-resend-hint { font-size: .8rem; color: #6b7280; line-height: 1.45; margin-bottom: 12px; }
@keyframes statusUrgentPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(227,6,19,.15); }
  50% { box-shadow: 0 0 0 8px rgba(227,6,19,0); }
}

/* Banner akceptacji w modal leada (LEGACY — pozostawiony dla kompatybilności) */
.ld-acc-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #95c11f;
  color: #fff;
  padding: 14px 16px;
  border-radius: 14px;
  margin-bottom: 14px;
  box-shadow: 0 4px 14px -4px rgba(15,23,42,.16);
  animation: leadAccPulse 2.5s ease-in-out infinite;
}
.ld-acc-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.25);
  font-weight: 900;
  font-size: 1.3rem;
  flex-shrink: 0;
}
.ld-acc-title {
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1.2;
}
.ld-acc-sub {
  font-size: .78rem;
  opacity: .9;
  margin-top: 2px;
  font-weight: 600;
}

.ld-sent-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border: 1.5px solid #f59e0b;
  color: #92400e;
  padding: 12px 14px;
  border-radius: 12px;
  margin-bottom: 14px;
}
.ld-sent-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(217,119,6,.18);
  font-size: 1.05rem;
  flex-shrink: 0;
}
.ld-sent-title {
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .02em;
  line-height: 1.2;
}
.ld-sent-sub {
  font-size: .76rem;
  margin-top: 2px;
  font-weight: 600;
  opacity: .85;
}

/* PIPELINE v2 — etykiety pod dotami, widać gdzie jesteś */
.lh-pipeline-v2 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 14px 4px 8px;
  margin: 8px 0 4px;
  position: relative;
}
.lpv2-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}
.lpv2-dot {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid #cbd5e1;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .72rem;
  font-weight: 900;
  color: transparent;
  position: relative;
}
.lpv2-step.done .lpv2-dot {
  background: #95c11f;
  border-color: #7cb342;
  color: #ffffff;
}
.lpv2-step.current .lpv2-dot {
  border-color: #1d2a3a;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(149,193,31,.25);
}
.lpv2-pulse {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #95c11f;
  animation: lpvPulse 1.5s ease-in-out infinite;
}
@keyframes lpvPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(.7); opacity: .6; }
}
.lpv2-lbl {
  font-size: .62rem;
  font-weight: 700;
  color: #94a3b8;
  letter-spacing: .03em;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
}
.lpv2-step.done .lpv2-lbl { color: #5a8a1e; }
.lpv2-step.current .lpv2-lbl { color: #1d2a3a; font-weight: 900; }

.lpv2-line {
  flex: 1;
  height: 2px;
  background: #e5e7eb;
  margin: 11px 2px 0;
  align-self: flex-start;
  border-radius: 2px;
  min-width: 12px;
}

/* Termin info row w header (kiedy umówiony) — z quick action btn */
.lh-termin-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0 0;
  padding: 10px 12px;
  background: #f0fdf4;
  border-left: 3px solid #95c11f;
  border-radius: 0 10px 10px 0;
  font-size: .85rem;
  color: #1d2a3a;
}
.lh-termin-row b { color: #5a8a1e; font-weight: 800; }
.lh-termin-info { flex: 1; min-width: 0; }
.lh-termin-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 12px;
  background: #1d2a3a;
  color: #95c11f;
  border: 0;
  border-radius: 8px;
  font-size: .75rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .01em;
  -webkit-tap-highlight-color: transparent;
  font-family: inherit;
  white-space: nowrap;
  flex-shrink: 0;
  transition: all .15s;
  box-shadow: 0 2px 6px rgba(15,23,42,.18);
}
.lh-termin-btn:active { transform: scale(.95); }
.lh-termin-btn:hover {
  background: #95c11f;
  color: #1d2a3a;
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14);
}

/* Calendar highlight gdy klikniesz "Zobacz w kalendarzu" */
.cal-day-highlight,
.cal-event-highlight {
  animation: calHighlight 1.5s ease-in-out 2;
  box-shadow: 0 0 0 4px rgba(149,193,31,.4), 0 8px 28px rgba(149,193,31,.4) !important;
  border-color: #95c11f !important;
  z-index: 5;
  position: relative;
}
@keyframes calHighlight {
  0%, 100% { box-shadow: 0 0 0 4px rgba(149,193,31,.4); }
  50% { box-shadow: 0 0 0 10px rgba(149,193,31,.15), 0 0 0 4px rgba(149,193,31,.5); }
}

/* Primary button DISABLED — czekamy na klienta */
.ld-action-primary.disabled,
.ld-action-primary:disabled {
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%) !important;
  color: #94a3b8 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  position: relative;
  overflow: hidden;
}
.ld-action-primary.disabled::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent 0%, rgba(149,193,31,.18) 50%, transparent 100%);
  animation: ldWait 2.5s ease-in-out infinite;
}
@keyframes ldWait {
  0% { left: -100%; }
  50% { left: 100%; }
  100% { left: 100%; }
}

/* Subtelny hint nad CTA — np. "Zadzwoń do klienta" */
.ld-call-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fffbeb;
  border-left: 3px solid #f59e0b;
  padding: 10px 14px;
  border-radius: 0 10px 10px 0;
  font-size: .82rem;
  color: #92400e;
  font-weight: 600;
  margin-bottom: 12px;
}

/* INNE OPCJE — zwijane secondary actions (mniej chaosu) */
.ld-secondary-collapse {
  margin-top: 12px;
}
.ld-secondary-collapse summary {
  list-style: none;
  cursor: pointer;
  padding: 10px 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 700;
  color: #6b7589;
  display: flex;
  justify-content: space-between;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
}
.ld-secondary-collapse summary::-webkit-details-marker { display: none; }
.ld-secondary-collapse[open] summary {
  border-radius: 10px 10px 0 0;
  border-bottom: 0;
}
.ld-secondary-collapse[open] .lsc-arrow { transform: rotate(180deg); }
.lsc-arrow { transition: transform .18s; font-size: .7rem; }
.lsc-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-top: 0;
  border-radius: 0 0 10px 10px;
}
.ld-secondary-btn {
  display: block;
  width: 100%;
  padding: 11px 14px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 600;
  color: #1d2a3a;
  cursor: pointer;
  text-align: left;
  transition: background .12s, border-color .12s;
}
.ld-secondary-btn:active { transform: scale(.985); }
.ld-secondary-btn:hover { background: #f8fafc; border-color: #cbd5e1; }
.ld-secondary-btn.danger {
  color: #b91c1c;
  border-color: #fecaca;
}
.ld-secondary-btn.danger:hover { background: #fef2f2; border-color: #f87171; }

/* ═══════════════════════════════════════════════════════════════
   CRM FUNNEL PILL BAR — wizualny lejek, kliknij = filtruj
   Stonowane kolory: szary stage / zielony aktywny + sukces
   ═══════════════════════════════════════════════════════════════ */
/* Statystyki etapów — JEDNA karta (grouped) z cienkimi pionowymi separatorami */
.crm-funnel {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0 0 14px;
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
}
.cfp {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 18px 8px;
  background: transparent;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background .18s;
  -webkit-tap-highlight-color: transparent;
  font-variant-numeric: tabular-nums;
}
/* hairline pionowy między statystykami */
.cfp:not(:last-child)::after {
  content: ''; position: absolute; top: 22%; bottom: 22%; right: 0;
  width: 0.5px; background: rgba(60,60,67,.13);
}
.cfp:active { background: #f5f5f8; }

.cfp-cnt {
  font-size: 1.4rem;
  font-weight: 800;
  color: #1d2a3a;
  line-height: 1;
  letter-spacing: -.03em;
}
.cfp-lbl {
  font-size: .74rem;
  color: #64748b;
  font-weight: 600;
  letter-spacing: -.01em;
}

/* Aktywny — granatowy segment (akcent) z zieloną liczbą; bez cienia w karcie */
.cfp.active { background: #1d2a3a; box-shadow: none; }
.cfp.active .cfp-cnt { color: #95c11f; }
.cfp.active .cfp-lbl { color: rgba(255,255,255,.82); }
/* separator nie dotyka granatowego segmentu */
.cfp.active::after, .cfp:has(+ .cfp.active)::after { display: none; }

/* Pusty etap — lekko wyszarzony (gdy 0) */
.cfp:not(.active):has(.cfp-cnt:empty) { opacity: .55; }

/* PULA KLIENTÓW — Apple card z borderem + zielonym akcentem */
.crm-inbox {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 18px 20px;
  margin: 0 0 14px;
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 18px;
  cursor: pointer;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  transition: box-shadow .25s, transform .15s, border-color .2s;
  text-align: left;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  position: relative;
  overflow: hidden;
}
.crm-inbox::before { display: none; }
.crm-inbox:active { transform: none; background: #fafafc; }
.crm-inbox:hover { box-shadow: 0 1px 2px rgba(15,23,42,.05); }
/* Ikona: czysty, cienki symbol bez kolorowego tła (SF Symbols) */
.ci-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: transparent;
  color: #3a4150;
  flex-shrink: 0;
}
.ci-icon svg { width: 25px; height: 25px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.ci-text { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.ci-title {
  font-size: .95rem;
  font-weight: 600;
  color: hsl(240 10% 3.9%);
  letter-spacing: -.01em;
  line-height: 1;
}
.ci-sub {
  font-size: .8rem;
  color: hsl(240 3.8% 46.1%);
  font-weight: 400;
  line-height: 1.4;
}
.ci-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0 9px;
  background: #95c11f;
  color: #1d2a3a;
  border-radius: 9999px;
  font-size: .82rem;
  font-weight: 700;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
.crm-inbox[data-empty="true"] .ci-badge { background: hsl(240 4.8% 95.9%); color: hsl(240 3.8% 46.1%); }

/* Section divider "🎯 Twój CRM" */
/* Section divider — z ikoną wewnątrz, mocno odseparowany */
/* Nagłówek sekcji — JEDEN spójny styl: małe wersaliki, stonowane (jak „PILNE"/„UMÓW") */
.crm-section-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 28px 0 12px;
  padding: 0 4px;
  font-size: .7rem;
  font-weight: 800;
  color: #9ca3af;
  letter-spacing: .08em;
  text-transform: uppercase;
  position: relative;
}
.crm-section-divider::before { content: none; }
.crm-section-divider::after { content: none; }
.crm-section-divider .csd-ico {
  width: 14px;
  height: 14px;
  stroke: #9ca3af;
  flex-shrink: 0;
}

/* ── POOL SCREEN (osobny ekran „Skrzynka odbiorcza") ── */
.pool-screen-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0 20px;
}
.psh-back {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  color: #1d2a3a;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.psh-back:active { transform: scale(.94); }
.psh-text { flex: 1; min-width: 0; }
.psh-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 10px;
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14);
  -webkit-tap-highlight-color: transparent;
  font-family: inherit;
  letter-spacing: -.005em;
  position: relative;
}
/* Owner badge w przycisku — granat tło + biały tekst (kontrast na zielonym CTA) */
.psh-add-btn .owner-badge-mini {
  background: #1d2a3a;
  box-shadow: none;
  color: #95c11f;
}
.psh-add-btn:active { transform: scale(.96); }
.psh-add-btn:hover { box-shadow: 0 6px 18px rgba(149,193,31,.45); }
.psh-title {
  font-size: 1.35rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.025em;
  display: flex;
  align-items: center;
  gap: 9px;
}
.psh-title svg { width: 23px !important; height: 23px !important; stroke: #1d2a3a; fill: none; flex-shrink: 0; }
.psh-sub {
  font-size: .76rem;
  color: #6b7589;
  margin-top: 2px;
}

.pool-info-banner {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  background: #f8fafc;
  border: none;
  border-left: 3px solid #cbd5e1;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 18px;
  font-size: .82rem;
  color: #475569;
  line-height: 1.5;
}
.pool-info-banner b { color: #1d2a3a; font-weight: 700; }
.pib-ico { flex-shrink: 0; line-height: 0; margin-top: 1px; }
.pib-ico svg { width: 18px !important; height: 18px !important; stroke: #64748b; fill: none; }

.pool-empty {
  text-align: center;
  padding: 80px 24px;
}
.pool-empty .pe-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto;
  border-radius: var(--r-lg);
  background: #f9fafb;
  border: 1px solid #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
}
.pool-empty .pe-icon svg { width: 36px; height: 36px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.pool-empty .pe-title {
  font-size: 1rem;
  font-weight: 600;
  color: #09090b;
  margin-top: 20px;
  letter-spacing: -.01em;
}
.pool-empty .pe-sub {
  font-size: .85rem;
  font-weight: 400;
  color: #6b7280;
  margin-top: 8px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.5;
}
.pool-empty-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 24px;
  padding: 12px 20px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: var(--r-sm);
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: -.005em;
  box-shadow: 0 2px 8px rgba(149,193,31,.35);
  -webkit-tap-highlight-color: transparent;
  font-family: inherit;
  transition: all .15s ease;
}
.pool-empty-cta svg { width: 16px !important; height: 16px !important; stroke: #1d2a3a; fill: none; stroke-width: 1.8; }
.pool-empty-cta:active { transform: scale(.97); }
.pool-empty-cta:hover { box-shadow: 0 4px 14px rgba(149,193,31,.5); transform: translateY(-1px); }

.pool-card {
  background: #ffffff;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 16px;
  padding: 16px 18px;
  margin-bottom: 14px;
  cursor: pointer;
  transition: border-color .18s, box-shadow .2s;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.pool-card:active { transform: scale(.99); }
.pool-card:hover { border-color: rgba(15,23,42,.14); box-shadow: 0 8px 20px -6px rgba(15,23,42,.08); }

/* Pula card LOCKED — tylko Weź button klika, reszta karty nie */
.pool-card-locked {
  cursor: default;
}
.pool-card-locked .pc-main,
.pool-card-locked .pc-source { cursor: default; }
.pool-card-locked:active { transform: none; }
.pool-card-locked .pc-claim-btn { cursor: pointer; }

.pc-source {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.pc-src-tag {
  display: inline-flex;
  align-items: center;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .04em;
  color: #92400e;
  background: #fef3c7;
  padding: 3px 8px;
  border-radius: 6px;
  text-transform: uppercase;
}
.pc-when { font-size: .72rem; color: #94a3b8; font-weight: 600; }

.pc-main { margin-bottom: 12px; }
.pc-name {
  font-size: 1.1rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.015em;
}
.pc-meta {
  font-size: .82rem;
  color: #6b7589;
  margin-top: 2px;
}
.pc-phone {
  font-size: .85rem;
  color: #1d2a3a;
  margin-top: 6px;
  font-weight: 600;
}
.pc-masked {
  font-family: 'Courier New', monospace !important;
  letter-spacing: 2px;
}
.pc-mask-hint {
  font-size: .75rem;
  opacity: .55;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.pc-budget {
  display: inline-block;
  margin-top: 6px;
  padding: 4px 10px;
  background: #f0fdf4;
  color: #5a8a1e;
  border-radius: 8px;
  font-size: .78rem;
  font-weight: 700;
}
.pc-locked {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  font-size: .76rem;
  color: #94a3b8;
  font-weight: 500;
}
.pc-locked svg { stroke: #94a3b8; fill: none; flex-shrink: 0; }

/* Locked info banner w lead detail (pula not yet claimed) */
.lh-locked-info {
  margin: 10px 0 4px;
  padding: 10px 14px;
  background: #f1f5f9;
  border: 1.5px dashed #cbd5e1;
  border-radius: 10px;
  font-size: .82rem;
  color: #475569;
  font-weight: 600;
  text-align: center;
}

.pc-claim-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 14px;
  padding: 13px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 12px;
  font-size: .92rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: -.01em;
  box-shadow: 0 4px 12px -3px rgba(149,193,31,.45);
  -webkit-tap-highlight-color: transparent;
  font-family: inherit;
  transition: background .15s, transform .1s;
}
.pc-claim-btn svg { width: 17px !important; height: 17px !important; stroke: #1d2a3a; fill: none; stroke-width: 2; flex-shrink: 0; }
.pc-claim-btn:hover { background: #88b31c; }
.pc-claim-btn:active { transform: scale(.98); }


/* ── PULA LEADÓW — wydzielony pasek (DiBO branding granat/zielony, nie żółty) ── */
/* Pula bar — shadcn Card + green left accent (brand) */
.crm-pool-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 20px 24px;
  margin: 16px 0 12px;
  background: hsl(0 0% 100%);
  border: 1px solid hsl(240 5.9% 90%);
  border-left: 3px solid #95c11f;
  border-radius: 0.75rem;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color .15s, box-shadow .2s, transform .15s;
  text-align: left;
  font-family: inherit;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
.crm-pool-bar::before { display: none; }
.crm-pool-bar:active { transform: scale(.997); }
.crm-pool-bar:hover {
  border-color: hsl(240 5% 84%);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.04);
}
.crm-pool-bar.active {
  border-color: hsl(74 49% 44% / .3);
  border-left-color: #95c11f;
  box-shadow: 0 0 0 3px rgb(149 193 31 / .12);
}
.crm-pool-bar.empty { opacity: .65; }

/* Icon container — bg-muted (shadcn) z zielonym akcentem */
.cpb-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 0.5rem;                          /* rounded-lg */
  background: rgb(149 193 31 / .12);
  color: #95c11f;
  flex-shrink: 0;
}
.cpb-icon svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.cpb-text {
  font-size: .95rem;
  color: hsl(240 10% 3.9%);
  font-weight: 600;
  flex-shrink: 0;
  letter-spacing: -.01em;
}
.cpb-text b {
  font-size: 1.25rem;
  font-weight: 700;
  color: #95c11f;
  letter-spacing: -.02em;
  margin-right: 4px;
  font-variant-numeric: tabular-nums;
}
.cpb-sub {
  flex: 1;
  font-size: .8rem;
  color: hsl(240 3.8% 46.1%);
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.4;
}
.cpb-arrow {
  font-size: 1.1rem;
  color: #9ca3af;
  font-weight: 400;
}

/* "Pokaż wszystkich" link (dla ownerów) — subtelny */
.crm-all-link {
  display: block;
  width: 100%;
  padding: 8px 12px;
  margin: 0 0 14px;
  background: transparent;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  color: #6b7589;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  transition: all .15s;
}
.crm-all-link:active { transform: scale(.98); }
.crm-all-link.active {
  background: #f0fdf4;
  border-color: #95c11f;
  border-style: solid;
  color: #5a8a1e;
  font-weight: 700;
}
.crm-all-link span { font-weight: 800; color: #1d2a3a; }
.crm-all-link.active span { color: #5a8a1e; }


/* ═══════════════════════════════════════════════════════════════
   PROFILE HERO — premium z avatar Google
   ═══════════════════════════════════════════════════════════════ */
.profile-hero {
  text-align: center;
  padding: 8px 0 24px;
  position: relative;
}
.profile-avatar-wrap {
  position: relative;
  width: 96px;
  height: 96px;
  margin: 0 auto 14px;
  display: inline-block;
}
.profile-avatar-placeholder {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #fff;
  border: 3px solid #95c11f;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(149,193,31,.25);
  overflow: hidden;
}
.profile-display-name {
  font-size: 1.35rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.02em;
  margin-bottom: 2px;
}
.profile-display-sub {
  font-size: .82rem;
  color: #6b7589;
  font-weight: 500;
  margin-bottom: 10px;
}
.profile-display-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  background: #f0fdf4;
  border: 1px solid #95c11f;
  border-radius: 999px;
  font-size: .72rem;
  color: #5a8a1e;
  font-weight: 700;
  letter-spacing: .02em;
}
.profile-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #95c11f;
  box-shadow: 0 0 8px rgba(149,193,31,.6);
  animation: profileDotPulse 1.8s ease-in-out infinite;
}
@keyframes profileDotPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .5; transform: scale(.85); }
}

/* QC: Required / Optional labels */
.qc-req {
  display: inline-block;
  margin-left: 3px;
  color: #ef4444;
  font-weight: 900;
}
.qc-opt {
  font-size: .72em;
  color: #94a3b8;
  font-weight: 500;
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
  margin-left: 4px;
}
.qc-section-hint {
  font-size: .7em;
  color: #6b7589;
  font-weight: 500;
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 6px;
}
.qc-hint-line {
  margin-top: 8px;
  padding: 8px 12px;
  background: #f0fdf4;
  border-left: 3px solid #95c11f;
  border-radius: 0 8px 8px 0;
  font-size: .78rem;
  color: #2a3a4d;
  line-height: 1.5;
}

/* PDF: proponowany termin na cover */
.qpdf-proposed-term {
  display: flex;
  gap: 14px;
  margin: 14px 0 18px;
  padding: 16px 20px;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 1.5px solid #3b82f6;
  border-radius: 14px;
  align-items: center;
}
.qpt-ico {
  font-size: 1.8rem;
  flex-shrink: 0;
}
.qpt-text { flex: 1; }
.qpt-lbl {
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .12em;
  color: #1d4ed8;
}
.qpt-val {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1d2a3a;
  margin-top: 4px;
  letter-spacing: -.01em;
}
.qpt-hint {
  font-size: .72rem;
  color: #6b7589;
  margin-top: 4px;
}

/* QC: Input z błędem walidacji — czerwone podświetlenie */
.qc-input-error {
  border-color: #ef4444 !important;
  background: #fef2f2 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.15) !important;
  animation: qcShake .4s ease-in-out;
}
@keyframes qcShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-6px); }
  75% { transform: translateX(6px); }
}

/* Profil: przycisk "Instrukcja obsługi" + wersja na dole */
.profile-tutorial-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  margin: 18px 0 8px;
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: all .15s;
}
.profile-tutorial-btn:active { transform: none; background: #fafafc; }
.profile-tutorial-btn:hover { box-shadow: 0 1px 2px rgba(15,23,42,.05); }
.ptb-ico {
  width: 30px;
  height: 30px;
  background: transparent;
  color: #3a4150;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: none;
}
.ptb-ico svg { width: 24px !important; height: 24px !important; stroke: currentColor; fill: none; stroke-width: 1.6; }
.ptb-text { flex: 1; min-width: 0; }
.ptb-title {
  font-size: .95rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.ptb-sub {
  font-size: .76rem;
  color: #6b7589;
  margin-top: 2px;
  font-weight: 600;
}
.ptb-arrow {
  color: #95c11f;
  font-weight: 900;
  font-size: 1.4rem;
  flex-shrink: 0;
}
.profile-footer-version {
  text-align: center;
  font-size: .7rem;
  color: #94a3b8;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 16px 0 8px;
  margin-top: 8px;
  border-top: 1px dashed #e5e7eb;
}


/* ═══════════════════════════════════════════════════════════════
   HERO TASK — Premium DiBO branded "Co teraz zrobić" GPS card
   z Liquid Glass elementami (glassmorphism)
   ═══════════════════════════════════════════════════════════════ */
/* Hero Task — Apple premium dark card (granat) */
.dash-hero-task {
  background: #1d2a3a;
  border-radius: 1.125rem;
  padding: 24px;
  margin: 0 0 20px;
  box-shadow: 0 8px 24px rgba(15,23,42,.12), 0 2px 6px rgba(15,23,42,.06);
  color: #ffffff;
  position: relative;
  overflow: hidden;
}
/* Liquid glass orb — subtelne kolorowe światło w tle */
.dash-hero-task .glass-orb {
  position: absolute;
  top: -30%;
  right: -10%;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(149,193,31,.18) 0%, transparent 60%);
  pointer-events: none;
  filter: blur(20px);
}
/* Brak paska zielonego u góry — Apple = czysta powierzchnia */
.dash-hero-task::before, .dash-hero-task::after { display: none; }
/* Status tag — sam tekst + pulsująca kropka (efekt "na żywo") */
.dht-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  padding: 0;
  margin-bottom: 14px;
  background: transparent !important;
  text-transform: uppercase;
  border: 0 !important;
  box-shadow: none !important;
}
.dht-tag::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  animation: dhtDot 1.4s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes dhtDot {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 currentColor; }
  50% { opacity: .6; box-shadow: 0 0 0 4px transparent; }
}
.dht-tag-today    { color: #fda4af; }
.dht-tag-urgent   { color: #fda4af; }
.dht-tag-accepted { color: #b1d63d; }
.dht-tag-tomorrow { color: #fcd34d; }
.dht-tag-pool     { color: #b1d63d; }
.dht-tag-normal   { color: rgba(255,255,255,.6); }
.dht-tag-done     { color: #b1d63d; }
.dht-tag-done::before, .dht-tag-normal::before { animation: none; }
.dht-row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  position: relative;
}
/* Ikona w hero task — sam outline bezpośrednio na granat (bez kwadratu/glow) */
.dht-ico {
  width: 40px;
  height: 40px;
  background: transparent;
  border: 0;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: rgba(255,255,255,.85);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.dht-ico svg { width: 32px !important; height: 32px !important; stroke: rgba(255,255,255,.9); stroke-width: 1.5; fill: none; }
.dht-text { flex: 1; min-width: 0; }
.dht-title {
  font-size: 1.375rem;
  font-weight: 600;
  letter-spacing: -.022em;
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 4px;
}
.dht-sub {
  font-size: .88rem;
  color: rgba(255,255,255,.7);
  line-height: 1.4;
}
.dht-actions {
  display: flex;
  gap: 10px;
}
/* Primary CTA "Zadzwoń" — flat zielony z subtelnym rozproszonym glow */
.dht-cta {
  flex: 1;
  padding: 13px 22px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 0.625rem;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: -.01em;
  font-family: inherit;
  box-shadow: 0 8px 24px rgba(139, 195, 74, .25);
  transition: all .15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.dht-cta svg { width: 18px !important; height: 18px !important; stroke: #1d2a3a; fill: none; stroke-width: 1.8; flex-shrink: 0; }
.dht-cta:active { transform: scale(.97); }
.dht-cta:hover { background: #7cb342; box-shadow: 0 10px 28px rgba(139, 195, 74, .35); }

/* Ghost CTA "Otwórz szczegóły" — czysty Ghost (no bg, no border) */
.dht-cta-ghost {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  color: rgba(255,255,255,.85);
  border: 0;
  box-shadow: none;
  flex: .7;
  padding: 13px 16px;
}
.dht-cta-ghost svg { width: 18px !important; height: 18px !important; stroke: rgba(255,255,255,.85); stroke-width: 1.5; fill: none; flex-shrink: 0; }
.dht-cta-ghost:hover {
  background: rgba(255,255,255,.06);
  color: #ffffff;
  transform: none;
  box-shadow: none;
}
.dht-cta-ghost:hover svg { stroke: #ffffff; }


/* ═══════════════════════════════════════════════════════════════
   ONBOARDING — 3 kroki premium DiBO
   ═══════════════════════════════════════════════════════════════ */
.ob-overlay {
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at top, #243447 0%, #1d2a3a 60%, #131c28 100%);
  z-index: 10005;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 18px;
  transition: opacity .25s;
}
.ob-card {
  background: #ffffff;
  border-radius: 28px;
  padding: 30px 26px 24px;
  max-width: 440px;
  width: 100%;
  box-shadow: 0 30px 60px rgba(0,0,0,.45);
  max-height: 92vh;
  overflow-y: auto;
  text-align: center;
}
.ob-progress {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-bottom: 22px;
}
.ob-dot {
  width: 32px;
  height: 6px;
  background: #e5e7eb;
  border-radius: 3px;
  transition: all .25s;
}
.ob-dot.active {
  background: linear-gradient(90deg, #95c11f, #7cb342);
  width: 56px;
}
.ob-step { animation: obFadeIn .35s ease; }
@keyframes obFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.ob-hero { margin-bottom: 18px; }
.ob-badge {
  width: 80px;
  height: 80px;
  margin: 0 auto 10px;
  display: block;
  filter: drop-shadow(0 8px 20px rgba(149,193,31,.35));
}
.ob-welcome-name {
  font-size: 1.1rem;
  color: #6b7589;
  font-weight: 600;
}
.ob-welcome-name span {
  color: #1d2a3a;
  font-weight: 900;
}
.ob-title {
  font-size: 1.4rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.025em;
  margin-bottom: 10px;
}
.ob-desc {
  font-size: .95rem;
  color: #4b5563;
  line-height: 1.6;
  margin-bottom: 20px;
}
.ob-perks {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 22px;
  text-align: left;
}
.ob-perk {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f8faf5;
  border: 1px solid #e0e9d2;
  border-radius: 12px;
  padding: 10px 14px;
  font-size: .88rem;
  color: #2a3a4d;
  line-height: 1.4;
}
.ob-perk .op-ico { font-size: 1.2rem; flex-shrink: 0; }
.ob-perk b { color: #1d2a3a; font-weight: 800; }
.ob-btn-primary {
  width: 100%;
  padding: 16px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 14px;
  font-size: 1.05rem;
  font-weight: 900;
  cursor: pointer;
  letter-spacing: .02em;
  font-family: inherit;
  box-shadow: 0 10px 28px rgba(149,193,31,.4);
  margin-bottom: 10px;
}
.ob-btn-primary:active { transform: scale(.97); }
.ob-btn-secondary {
  flex: 1;
  padding: 14px;
  background: #ffffff;
  color: #475569;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}
.ob-btn-secondary:active { transform: scale(.97); }
.ob-actions-row { display: flex; gap: 10px; }
.ob-actions-row .ob-btn-primary { flex: 1.5; margin-bottom: 0; }
.ob-skip {
  background: transparent;
  border: 0;
  color: #94a3b8;
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  padding: 8px;
  text-decoration: underline;
  font-family: inherit;
}
.ob-skip:hover { color: #6b7589; }
.ob-funnel-anim {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin-bottom: 18px;
}
.ofa-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: #f1f5f9;
  border-radius: 10px;
  font-size: .88rem;
  font-weight: 700;
  color: #475569;
}
.ofa-row.highlighted {
  background: #fef3c7;
  color: #92400e;
  border: 1.5px solid #f59e0b;
}
.ofa-row.done {
  background: #95c11f;
  color: #ffffff;
  box-shadow: 0 4px 14px rgba(149,193,31,.35);
}
.ofa-arrow { color: #cbd5e1; font-size: 1rem; }
.ob-notif-ico {
  width: 80px;
  height: 80px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #d97706;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 30px rgba(245,158,11,.3);
  animation: obBellRing 2s ease-in-out infinite;
}
@keyframes obBellRing {
  0%, 100% { transform: rotate(0); }
  20%, 60% { transform: rotate(15deg); }
  40%, 80% { transform: rotate(-15deg); }
}


/* ═══════════════════════════════════════════════════════════════
   CRM EMPTY STATE — z prawdziwym CTA
   ═══════════════════════════════════════════════════════════════ */
.crm-empty-state {
  text-align: center;
  padding: 64px 20px;
}
.ces-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 20px;
  border-radius: var(--r-lg);
  background: #f9fafb;
  border: 1px solid #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
}
.ces-icon svg { width: 36px; height: 36px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.ces-title {
  font-size: 1rem;
  font-weight: 600;
  color: #09090b;
  letter-spacing: -.01em;
  margin-bottom: 6px;
}
.ces-sub {
  font-size: .85rem;
  font-weight: 400;
  color: #6b7280;
  line-height: 1.5;
  max-width: 320px;
  margin: 0 auto 20px;
}
.ces-cta { margin-top: 16px; }
.empty-cta-primary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 20px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: var(--r-sm);
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: -.005em;
  box-shadow: 0 2px 8px rgba(149,193,31,.35);
  font-family: inherit;
  transition: all .15s ease;
}
.empty-cta-primary svg { width: 16px !important; height: 16px !important; stroke: #1d2a3a; fill: none; stroke-width: 1.8; }
.empty-cta-primary:active { transform: scale(.97); }
.empty-cta-primary:hover { box-shadow: 0 4px 14px rgba(149,193,31,.5); transform: translateY(-1px); }


/* ═══════════════════════════════════════════════════════════════
   LOGOUT FADE OVERLAY
   ═══════════════════════════════════════════════════════════════ */
.logout-fade-overlay {
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at center, #243447 0%, #1d2a3a 70%);
  backdrop-filter: blur(20px);
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: lfoFadeIn .25s ease;
}
@keyframes lfoFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.lfo-card {
  text-align: center;
  color: #ffffff;
}
.lfo-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid rgba(255,255,255,.15);
  border-top-color: #95c11f;
  border-radius: 50%;
  margin: 0 auto 18px;
  animation: lfoSpin 1s linear infinite;
}
@keyframes lfoSpin { to { transform: rotate(360deg); } }
.lfo-text {
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: .02em;
}


/* ═══════════════════════════════════════════════════════════════
   GCAL PROMPT BANNER
   ═══════════════════════════════════════════════════════════════ */
.gcal-prompt-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 1.5px solid #1a73e8;
  border-radius: 14px;
  margin: 12px 0 18px;
  box-shadow: 0 4px 14px rgba(26,115,232,.15);
}
.gpb-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(26,115,232,.2);
}
.gpb-text { flex: 1; min-width: 0; }
.gpb-title {
  font-size: .92rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.gpb-sub {
  font-size: .75rem;
  color: #4b5563;
  margin-top: 2px;
}
.gpb-btn {
  padding: 10px 16px;
  background: #1a73e8;
  color: #fff;
  border: 0;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 800;
  cursor: pointer;
  flex-shrink: 0;
  letter-spacing: .01em;
  font-family: inherit;
  box-shadow: 0 4px 12px rgba(26,115,232,.35);
}
.gpb-btn:active { transform: scale(.97); }


/* ACTION CHIP — minimalistyczny, mówi "co zrobić" */
.lead-action-chip {
  display: inline-flex;
  align-items: center;
  margin-top: 10px;
  padding: 5px 11px;
  border-radius: var(--r-xs);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: -.005em;
  line-height: 1.3;
  border: 1px solid transparent;
}
.lead-action-chip.urgent {
  animation: lacUrgent 1.6s ease-in-out infinite;
  font-weight: 700;
}
@keyframes lacUrgent {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.03); }
}

/* Karta PILNA — czerwony NADPISUJE branding (gdy coś jest pilne, kolor pilności wygrywa) */
.lead-card.lead-urgent {
  background: #fef2f2 !important;            /* bg-red-50 */
  border: 1px solid #fecaca !important;      /* border-red-200 */
  border-left: 3px solid #e30613 !important; /* mocny czerwony pasek */
  box-shadow: 0 1px 2px 0 rgb(220 38 38 / 0.05) !important;
}
.lead-card.lead-urgent::after { display: none; }
/* Wewnątrz karty PILNEJ — usuń całą zieleń */
.lead-card.lead-urgent .lead-row-main,
.lead-card.lead-urgent .lead-cta-row,
.lead-card.lead-urgent .lead-strip { background: transparent !important; }
.lead-card.lead-urgent .lead-accepted-banner {
  background: rgba(227,6,19,.08) !important;
  color: #b91c1c !important;
  border-bottom-color: #fecaca !important;
}
.lead-card.lead-urgent .lead-accepted-banner .lab-icon { background: #e30613 !important; }
/* Action chip w pilnej karcie — czerwony, nie zielony */
.lead-card.lead-urgent .lead-action-chip {
  background: #fee2e2 !important;
  color: #b91c1c !important;
}
/* Primary CTA w pilnej karcie — czerwony zamiast zielonego */
.lead-card.lead-urgent .lead-primary-btn {
  background: linear-gradient(135deg, #e30613 0%, #b91c1c 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(227,6,19,.3) !important;
}
.lead-card.lead-urgent .lead-primary-btn svg { fill: #ffffff !important; }
/* Imię klienta w pilnej karcie — ciemnoczerwony zamiast granatu */
.lead-card.lead-urgent .lead-name { color: #7f1d1d !important; }

/* Wizyta minęła — auto-banner pomarańczowy */
.ld-visit-passed {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border: 1.5px solid #f59e0b;
  border-radius: 14px;
  padding: 12px 16px;
  margin-bottom: 12px;
  color: #78350f;
}
.lvp-ico {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: #92400e;
}
.lvp-ico svg { width: 24px !important; height: 24px !important; stroke: currentColor; fill: none; }
.lvp-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: .85rem;
}
.lvp-text b {
  font-weight: 900;
  color: #78350f;
}
.lvp-text span:not(:first-child) {
  font-size: .76rem;
  color: #92400e;
  font-weight: 600;
}

/* Call reminder — GRANAT (kontrast z zielonym banner powyżej) */
.ld-call-reminder {
  display: flex !important;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
  padding: 14px 16px;
  background: #1d2a3a;
  border: 1.5px solid rgba(149,193,31,.3);
  border-radius: 14px;
  text-decoration: none !important;
  color: #ffffff !important;
  transition: all .15s;
  position: relative;
  overflow: hidden;
}
.ld-call-reminder::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #95c11f, transparent);
}
.ld-call-reminder:hover {
  border-color: #95c11f;
  box-shadow: 0 8px 22px rgba(149,193,31,.25);
}
.ld-call-reminder:active { transform: scale(.98); }
.lcr-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(149,193,31,.18);
  color: #95c11f;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lcr-ico svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; stroke-width: 1.7; }
.lcr-arrow { color: #95c11f; }
.lcr-arrow svg { width: 18px !important; height: 18px !important; stroke: currentColor; fill: none; }
.lcr-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lcr-title {
  font-size: .92rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: -.01em;
}
.lcr-phone {
  font-size: .82rem;
  font-weight: 700;
  color: #95c11f;
  letter-spacing: .04em;
}
.lcr-arrow {
  color: rgba(255,255,255,.4);
  font-size: 1.2rem;
  font-weight: 900;
  flex-shrink: 0;
}

/* LEAD: Zadzwoń aby potwierdzić termin — premium call CTA */
.ld-action-call {
  display: block !important;
  text-decoration: none !important;
  background: #95c11f !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 16px !important;
  padding: 18px 18px !important;
  margin-bottom: 8px;
  box-shadow: 0 10px 28px rgba(149,193,31,.45) !important;
  position: relative;
  overflow: hidden;
  animation: lacPulse 2.2s ease-in-out infinite;
}
.ld-action-call::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
  animation: lacShine 3s ease-in-out infinite;
}
@keyframes lacShine {
  0% { left: -100%; }
  50%, 100% { left: 100%; }
}
@keyframes lacPulse {
  0%, 100% { box-shadow: 0 10px 28px rgba(149,193,31,.45); }
  50% { box-shadow: 0 14px 36px rgba(149,193,31,.65); }
}
.lac-row {
  display: flex;
  align-items: center;
  gap: 14px;
  position: relative;
  z-index: 1;
}
.lac-ico {
  width: 44px;
  height: 44px;
  background: rgba(255,255,255,.22);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #ffffff;
}
.lac-ico svg { width: 22px !important; height: 22px !important; stroke: currentColor; fill: none; stroke-width: 1.7; }
.lac-arrow svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; }
.lac-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
}
.lac-title {
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: -.01em;
  color: #ffffff;
}
.lac-phone {
  font-size: 1.1rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: .03em;
  opacity: .95;
}
.lac-arrow {
  font-size: 1.4rem;
  font-weight: 900;
  color: rgba(255,255,255,.6);
  flex-shrink: 0;
}
.ld-action-call:active { transform: scale(.98); }

/* Po rozmowie — wpisz termin (granat, subtelne) */
.ld-action-after-call {
  display: block;
  width: 100%;
  padding: 14px;
  background: #1d2a3a;
  color: #95c11f;
  border: 1.5px solid rgba(149,193,31,.3);
  border-radius: 14px;
  font-size: .95rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .01em;
  font-family: inherit;
  transition: all .15s;
  text-align: center;
}
.ld-action-after-call:active { transform: scale(.98); }
.ld-action-after-call:hover {
  background: #95c11f;
  color: #1d2a3a;
  border-color: #95c11f;
}

/* CLAIM modal — zielone (pozytywne) zamiast czerwone */
.claim-card {
  border-top-color: #95c11f !important;
}
.claim-perks {
  background: #f0fdf4;
  border: 1.5px solid #c8e08c;
  border-radius: 12px;
  padding: 12px 14px;
  margin: 14px 0 18px;
  text-align: left;
}
.cp-row {
  font-size: .82rem;
  color: #2a3a4d;
  padding: 4px 0;
  line-height: 1.5;
}
.cp-row b { color: #5a8a1e; font-weight: 800; }
.claim-btn-confirm {
  background: #95c11f !important;
  box-shadow: 0 6px 18px rgba(149,193,31,.4) !important;
}
.claim-btn-confirm:hover {
  box-shadow: 0 8px 22px rgba(149,193,31,.55) !important;
}


/* LEAD: Service grid — premium kafle z ikonami SVG */
.lead-svc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 8px;
}
.lead-svc-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 6px 10px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  cursor: pointer;
  font-family: inherit;
  font-size: .82rem;
  font-weight: 700;
  color: #1d2a3a;
  -webkit-tap-highlight-color: transparent;
  transition: all .15s;
}
.lead-svc-btn:active { transform: scale(.96); }
.lead-svc-btn:hover {
  border-color: #95c11f;
  box-shadow: 0 4px 12px rgba(149,193,31,.15);
}
.lead-svc-btn.selected,
.lead-svc-btn.active {
  background: #f0fdf4;
  border-color: #95c11f;
  border-width: 2px;
  box-shadow: 0 4px 14px rgba(149,193,31,.2);
}
/* Multi-select checkmark — pokazuje że chip jest zaznaczony */
.lead-svc-btn { position: relative; }
.lead-svc-btn.selected::after,
.lead-svc-btn.active::after {
  content: '';
  position: absolute;
  top: 6px;
  right: 6px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #95c11f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d2a3a' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-11'/%3E%3C/svg%3E") center/11px no-repeat;
  box-shadow: 0 1px 3px rgba(149,193,31,.4);
}
.lead-svc-btn.selected .lsb-ico,
.lead-svc-btn.active .lsb-ico {
  background: #95c11f;
  color: #ffffff;
}
.lsb-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all .18s;
  background: #f3f4f6;
  color: #6b7280;
}
.lsb-ico svg { width: 22px !important; height: 22px !important; stroke: currentColor; fill: none; }
.lead-svc-other {
  margin-top: 10px;
  padding: 10px 12px;
  background: #f0fdf4;
  border-left: 3px solid #95c11f;
  border-radius: 0 10px 10px 0;
  animation: ssFadeIn .2s ease;
}
.lead-svc-other input {
  width: 100%;
  box-sizing: border-box;
}
.lead-svc-other::before {
  content: 'Co innego? Wpisz nazwę usługi:';
  display: block;
  font-size: .72rem;
  font-weight: 700;
  color: #5a8a1e;
  letter-spacing: .03em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
/* Hint przy labelach formularzy — "(możesz wybrać kilka)" */
.form-hint {
  font-size: .72rem;
  font-weight: 500;
  color: #9ca3af;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 4px;
}


/* LOGOUT — Premium modal */
.logout-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 10003;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 18px;
  animation: ssFadeIn .2s ease;
}
.lo-card {
  background: #ffffff;
  border-radius: 22px;
  padding: 28px 26px 22px;
  max-width: 380px;
  width: 100%;
  text-align: center;
  box-shadow: 0 25px 60px rgba(0,0,0,.45);
  border-top: 5px solid #e30613;
  animation: qcSentPop .3s cubic-bezier(.34, 1.56, .64, 1);
}
.lo-ico {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
  color: #e30613;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(227,6,19,.18);
}
.lo-title {
  font-size: 1.4rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.025em;
  margin-bottom: 4px;
}
.lo-sub {
  font-size: .88rem;
  color: #6b7589;
  margin-bottom: 14px;
}
.lo-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  margin-bottom: 14px;
  text-align: left;
}
.lo-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #1d2a3a;
  color: #95c11f;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: .95rem;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(15,23,42,.25);
}
.lo-user-info { flex: 1; min-width: 0; }
.lo-user-name {
  font-size: .95rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lo-user-email {
  font-size: .78rem;
  color: #6b7589;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lo-warning {
  background: #fffbeb;
  border-left: 4px solid #f59e0b;
  padding: 10px 14px;
  border-radius: 0 10px 10px 0;
  font-size: .76rem;
  color: #78350f;
  text-align: left;
  line-height: 1.55;
  margin-bottom: 18px;
}
.lo-actions {
  display: flex;
  gap: 10px;
}
.lo-btn-cancel {
  flex: 1;
  padding: 13px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  color: #1d2a3a;
  font-size: .92rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}
.lo-btn-cancel:active { transform: scale(.97); }
.lo-btn-cancel:hover { background: #f8fafc; }
.lo-btn-confirm {
  flex: 1.2;
  padding: 13px;
  background: linear-gradient(135deg, #e30613 0%, #b1050f 100%);
  border: 0;
  border-radius: 12px;
  color: #ffffff;
  font-size: .92rem;
  font-weight: 900;
  cursor: pointer;
  font-family: inherit;
  letter-spacing: .02em;
  box-shadow: 0 6px 18px rgba(227,6,19,.35);
}
.lo-btn-confirm:active { transform: scale(.97); }
.lo-btn-confirm:hover { box-shadow: 0 8px 22px rgba(227,6,19,.5); }


/* QC: Validation modal — "Brakuje danych" */
.qc-validation-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.65);
  backdrop-filter: blur(6px);
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: ssFadeIn .2s ease;
}
.qcv-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 28px 24px 20px;
  max-width: 360px;
  width: 100%;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0,0,0,.4);
  border-top: 5px solid #ef4444;
  animation: qcSentPop .3s cubic-bezier(.34, 1.56, .64, 1);
}
.qcv-icon {
  font-size: 2.8rem;
  margin-bottom: 8px;
}
.qcv-title {
  font-size: 1.2rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.02em;
  margin-bottom: 14px;
}
.qcv-list {
  background: #fef2f2;
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 14px;
  text-align: left;
}
.qcv-item {
  font-size: .92rem;
  color: #b91c1c;
  font-weight: 700;
  line-height: 1.7;
}
.qcv-hint {
  font-size: .82rem;
  color: #6b7589;
  margin-bottom: 18px;
  line-height: 1.5;
}
.qcv-close {
  width: 100%;
  padding: 13px;
  background: #1d2a3a;
  color: #fff;
  border: 0;
  border-radius: 12px;
  font-size: .95rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .02em;
  -webkit-tap-highlight-color: transparent;
}
.qcv-close:active { transform: scale(.97); }


/* QC: Sending overlay — premium loading */
.qc-sending-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.7);
  backdrop-filter: blur(8px);
  z-index: 10002;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: ssFadeIn .2s ease;
}
.qcs-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 36px 32px 28px;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0,0,0,.4);
  min-width: 260px;
  animation: qcSentPop .35s cubic-bezier(.34, 1.56, .64, 1);
}
.qcs-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid #e5e7eb;
  border-top-color: #95c11f;
  border-right-color: #95c11f;
  border-radius: 50%;
  margin: 0 auto 18px;
  animation: qcsSpin 1s linear infinite;
}
@keyframes qcsSpin { to { transform: rotate(360deg); } }
.qcs-text {
  font-size: 1rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
}


/* Wycena WYSŁANA — success modal premium */
.qc-sent-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: ssFadeIn .25s ease;
}
.qc-sent-card {
  background: #ffffff;
  border-radius: 22px;
  padding: 32px 28px 24px;
  max-width: 380px;
  width: 100%;
  text-align: center;
  box-shadow: 0 25px 60px rgba(0,0,0,.4);
  animation: qcSentPop .35s cubic-bezier(.34, 1.56, .64, 1);
}
@keyframes qcSentPop {
  from { transform: scale(.85) translateY(20px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}
.qc-sent-icon { margin-bottom: 14px; }
.qc-sent-icon svg path {
  stroke-dasharray: 50;
  stroke-dashoffset: 50;
  animation: qcCheck .6s .25s ease-out forwards;
}
@keyframes qcCheck { to { stroke-dashoffset: 0; } }
.qc-sent-title {
  font-size: 1.5rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.025em;
  margin-bottom: 8px;
}
.qc-sent-sub {
  font-size: .9rem;
  color: #2a3a4d;
  line-height: 1.6;
  margin-bottom: 16px;
}
.qc-sent-email {
  display: inline-block;
  margin-top: 4px;
  padding: 4px 10px;
  background: #f0fdf4;
  color: #5a8a1e;
  border-radius: 8px;
  font-weight: 700;
  font-size: .82rem;
}
.qc-sent-info {
  background: #fef3c7;
  border-left: 4px solid #f59e0b;
  padding: 10px 14px;
  border-radius: 0 8px 8px 0;
  font-size: .82rem;
  color: #92400e;
  margin-bottom: 18px;
  text-align: left;
  line-height: 1.5;
}
.qc-sent-close {
  width: 100%;
  padding: 14px;
  background: #95c11f;
  color: #fff;
  border: 0;
  border-radius: 12px;
  font-size: .95rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .02em;
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14);
}
.qc-sent-close:active { transform: scale(.97); }

/* Ukryj "Pokaż wszystkich" gdy nie ma sensu (1 lead) */
.crm-all-link[data-empty="true"] { display: none !important; }

/* Historia klientów — shadcn Card link */
.crm-history-link {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 18px 20px;
  margin: 14px 0 12px;
  background: hsl(0 0% 100%);
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 18px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: background .15s ease;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
}
.crm-history-link:active { transform: none; background: #fafafc; }
.crm-history-link:hover { box-shadow: 0 1px 2px rgba(15,23,42,.05); }
/* Ikona: czysty cienki symbol bez kolorowego tła */
.chl-ico {
  width: 30px;
  height: 30px;
  background: transparent;
  color: #3a4150;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.chl-ico svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.chl-text { flex: 1; min-width: 0; }
.chl-title {
  display: block;
  font-size: .95rem;
  font-weight: 600;
  color: hsl(240 10% 3.9%);
  letter-spacing: -.01em;
  line-height: 1;
}
.chl-sub {
  display: block;
  font-size: .8rem;
  color: hsl(240 3.8% 46.1%);
  font-weight: 400;
  margin-top: 6px;
}
.chl-sub b { color: #5a7811; font-weight: 600; }
.chl-arrow {
  color: hsl(240 5% 64.9%);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: color .15s, transform .15s;
}
.crm-history-link:hover .chl-arrow { color: #95c11f; transform: translateX(2px); }


/* ═══════════════════════════════════════════════════════════════
   REALIZED SCREEN — Historia zrealizowanych klientów (osobna strona)
   ═══════════════════════════════════════════════════════════════ */
.realized-banner {
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%);
  border-left-color: #95c11f;
}
.realized-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 18px;
}
.rs-tile {
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  padding: 14px 16px;
  text-align: left;
  position: relative;
  overflow: hidden;
}
.rs-tile::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: #95c11f;
}
.rs-tile-money::before { background: linear-gradient(180deg, #1d2a3a, #243447); }
.rs-val {
  font-size: 1.55rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.025em;
  line-height: 1;
}
.rs-val span {
  font-size: 1rem;
  color: #95c11f;
  font-weight: 800;
}
.rs-lbl {
  font-size: .68rem;
  font-weight: 800;
  color: #6b7589;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-top: 6px;
}

.realized-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-left: 3px solid #95c11f;
  border-radius: 0 14px 14px 0;
  padding: 14px 16px;
  margin-bottom: 10px;
  cursor: pointer;
  transition: all .15s;
}
.realized-card:hover {
  box-shadow: 0 6px 18px rgba(15,23,42,.08);
  border-left-color: #7cb342;
}
.realized-card:active { transform: scale(.99); }

.rc-left {
  position: relative;
  flex-shrink: 0;
}
.rc-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #95c11f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 1rem;
  box-shadow: 0 4px 10px rgba(149,193,31,.3);
}
.rc-followup-dot {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #f59e0b;
  border: 2px solid #fff;
  animation: rcPulse 1.5s ease-in-out infinite;
}
@keyframes rcPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}

.rc-body { flex: 1; min-width: 0; }
.rc-name-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.rc-name {
  font-size: 1rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.015em;
}
.rc-price {
  font-size: .95rem;
  font-weight: 900;
  color: #5a8a1e;
}
.rc-meta {
  font-size: .8rem;
  color: #6b7589;
  margin-top: 2px;
}
.rc-when {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  font-size: .76rem;
  color: #94a3b8;
  font-weight: 600;
}
.rc-when b { color: #1d2a3a; font-weight: 800; }
.rc-when-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #95c11f;
  color: #fff;
  font-size: .65rem;
  font-weight: 900;
}
.rc-followup-badge {
  margin-left: 8px;
  padding: 2px 8px;
  background: #fef3c7;
  color: #92400e;
  border-radius: 6px;
  font-size: .62rem;
  font-weight: 900;
  letter-spacing: .08em;
}

.rc-chev {
  font-size: 1.4rem;
  color: #cbd5e1;
  font-weight: 900;
  flex-shrink: 0;
}
.realized-card:hover .rc-chev { color: #95c11f; }

/* MVP: force-hide Follow-up Center (user request) */
#dashboardFollowUpCard,
.fu-center,
.fu-center * { display: none !important; visibility: hidden !important; }

/* ═══════════════════════════════════════════════════════════════
   HUB CENTRUM — Szkolenia / Tablica / Serwis / Profil
   ═══════════════════════════════════════════════════════════════ */
.hub-hero {
  padding: 20px 0 8px;
  margin-bottom: 18px;
  border-bottom: 1px solid #e5e7eb;
}
.hub-hero-title {
  font-size: 1.6rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.03em;
  margin-bottom: 4px;
}
.hub-hero-sub {
  font-size: .82rem;
  color: #6b7589;
  font-weight: 500;
}

.hub-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 80px;
}
.hub-tile {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 16px 18px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 16px;
  cursor: pointer;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  text-align: left;
  transition: all .15s;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.hub-tile:active { transform: scale(.985); }
.hub-tile:hover { border-color: #95c11f; box-shadow: 0 8px 24px rgba(149,193,31,.18); }

.hub-tile-ico {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(15,23,42,.15);
}
.hub-tile-text { flex: 1; min-width: 0; }
.hub-tile-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
  margin-bottom: 3px;
}
.hub-tile-sub {
  font-size: .8rem;
  color: #6b7589;
  font-weight: 500;
}
.hub-tile-arrow {
  font-size: 1.6rem;
  color: #cbd5e1;
  font-weight: 900;
  flex-shrink: 0;
}
.hub-tile:hover .hub-tile-arrow { color: #95c11f; }

/* REAKTYWACJA strip — wyróżniony pomarańczowy gradient z animacją */
.lead-strip.reactivated {
  display: flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, #fef3c7 0%, #fed7aa 100%);
  border-bottom: 1.5px solid #f59e0b;
  padding: 9px 14px;
  color: #92400e;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .01em;
}
.lsr-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #f59e0b;
  color: #fff;
  font-size: .9rem;
  animation: lsrRotate 3s linear infinite;
}
@keyframes lsrRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.lsr-text {
  flex: 1;
}
.lsr-text b {
  font-weight: 900;
  letter-spacing: .04em;
  color: #78350f;
}

/* OWNER PANEL — wydzielona sekcja w Hub */
.hub-owner-section {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 2px dashed #e5e7eb;
}
.hub-owner-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 20px 0 14px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  flex-wrap: wrap;
}
.hub-owner-title {
  font-size: .95rem;
  font-weight: 700;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.hub-tile-owner {
  border-left: 3px solid #f59e0b;
}

/* OWNER: ticket rows */
.ot-row {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.ot-head { display: flex; justify-content: space-between; margin-bottom: 6px; }
.ot-status {
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .1em;
  padding: 3px 9px;
  border-radius: 6px;
}
.ot-status.st-new { background: #fef3c7; color: #92400e; }
.ot-status.st-prog { background: #dbeafe; color: #1d4ed8; }
.ot-status.st-sch { background: #ecfccb; color: #5a8a1e; }
.ot-status.st-done { background: #dcfce7; color: #15803d; }
.ot-status.st-cancel { background: #f1f5f9; color: #64748b; }
.ot-when { font-size: .72rem; color: #94a3b8; font-weight: 600; }
.ot-amb { font-size: 1rem; font-weight: 800; color: #1d2a3a; margin-bottom: 4px; }
.ot-contact {
  display: flex;
  gap: 10px;
  font-size: .78rem;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.ot-contact a { color: #2a3a4d; text-decoration: none; font-weight: 600; }
.ot-body {
  font-size: .85rem;
  color: #4b5563;
  line-height: 1.5;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid #e5e7eb;
}

/* OWNER: stats rows */
.os-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  margin-bottom: 8px;
}
.os-rank {
  font-size: 1.1rem;
  font-weight: 900;
  color: #95c11f;
  width: 24px;
  flex-shrink: 0;
}
.os-meta { font-size: .76rem; color: #6b7589; margin-top: 2px; }
.os-meta b { color: #5a8a1e; font-weight: 800; }
.os-revenue {
  font-size: 1.1rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.02em;
  white-space: nowrap;
}
.os-revenue span { color: #95c11f; font-size: .8rem; }


/* Hub tile badges — NOWE / WKRÓTCE */
.hub-tile-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .1em;
  margin-left: 6px;
  vertical-align: middle;
  text-transform: uppercase;
}
.hub-tile-badge.new {
  background: #95c11f;
  color: #ffffff;
  animation: hubBadgePulse 1.8s ease-in-out infinite;
}
.hub-tile-badge.soon {
  background: #fef3c7;
  color: #92400e;
  border: 1px dashed #f59e0b;
}
@keyframes hubBadgePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(149,193,31,.5); }
  50% { box-shadow: 0 0 0 6px rgba(149,193,31,0); }
}

/* Locked tile — kursor not-allowed, opacity treść */
.hub-tile-locked {
  cursor: not-allowed !important;
  opacity: .75;
}
.hub-tile-locked:hover {
  border-color: #e5e7eb !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.04) !important;
}
.hub-tile-locked .hub-tile-arrow {
  color: #94a3b8 !important;
  font-size: 1.2rem;
}
.hub-tile-locked:hover .hub-tile-arrow { color: #94a3b8 !important; }
.hub-tile-active:hover .hub-tile-title .hub-tile-badge.new {
  transform: scale(1.05);
}


/* Tablica posts — PREMIUM cards */
.tablica-post {
  background: #ffffff;
  border: 1px solid hsl(240 5.9% 90%);
  border-left-width: 3px;
  border-radius: 16px;
  padding: 18px 20px 16px;
  margin-bottom: 14px;
  transition: border-color .18s, box-shadow .2s;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
  position: relative;
  overflow: hidden;
}
.tablica-post:hover {
  box-shadow: 0 8px 20px -6px rgba(15,23,42,.08);
  border-color: rgba(15,23,42,.14);
}
.tablica-post.training { border-left-color: #3b82f6; }
.tablica-post.meeting  { border-left-color: #95c11f; }
.tablica-post.event    { border-left-color: #f59e0b; }
.tablica-post.general  { border-left-color: #94a3b8; }
.tablica-post.past { opacity: .6; }

.tp-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.tp-type-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .12em;
  padding: 5px 12px;
  border-radius: 8px;
  text-transform: uppercase;
}
.tp-type-tag.training { background: #dbeafe; color: #1d4ed8; }
.tp-type-tag.meeting  { background: #dcfce7; color: #166534; }
.tp-type-tag.event    { background: #fef3c7; color: #92400e; }
.tp-type-tag.general  { background: #f1f5f9; color: #475569; }

.tp-date {
  font-size: .7rem;
  color: #94a3b8;
  font-weight: 700;
  letter-spacing: .02em;
}
.tp-title {
  font-size: 1.15rem;
  font-weight: 900;
  color: #1d2a3a;
  margin-bottom: 10px;
  letter-spacing: -.025em;
  line-height: 1.25;
}

/* Event date highlight */
.tp-event-date {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  padding: 10px 14px;
  margin: 0 0 12px;
  font-size: .9rem;
  font-weight: 700;
  color: #1d2a3a;
}
.tp-event-date.upcoming {
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%);
  border-color: #95c11f;
  box-shadow: 0 2px 8px rgba(149,193,31,.18);
}
.tp-event-date.past {
  opacity: .6;
  text-decoration: line-through;
}
.tp-event-badge {
  margin-left: auto;
  display: inline-block;
  padding: 2px 8px;
  background: #95c11f;
  color: #fff;
  border-radius: 6px;
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .1em;
}
.tp-event-badge.past {
  background: #94a3b8;
}

.tp-body {
  font-size: .92rem;
  color: #2a3a4d;
  line-height: 1.65;
  white-space: pre-wrap;
  margin-bottom: 14px;
}

/* Dashboard Owner Panel — krótki widget */
.dash-owner-panel {
  margin: 18px 0 4px;
  padding: 14px 14px 12px;
  background: linear-gradient(135deg, #fef2f2 0%, #ffffff 100%);
  border: 1.5px solid #fca5a5;
  border-radius: 16px;
}
.dop-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.dop-label-title {
  font-size: .95rem;
  font-weight: 700;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.dop-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.dop-tile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: all .15s;
}
.dop-tile:active { transform: scale(.97); }
.dop-tile:hover { box-shadow: 0 4px 12px rgba(15,23,42,.08); }
.dop-ico {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 3px 8px rgba(15,23,42,.18);
}
.dop-text { min-width: 0; }
.dop-title {
  font-size: .9rem;
  font-weight: 800;
  color: #1d2a3a;
}
.dop-sub {
  font-size: .68rem;
  color: #6b7589;
  margin-top: 1px;
  font-weight: 600;
}

/* Zapisy na szkolenia w panelu właściciela */
.dop-signups {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #fca5a5;
}
.dop-signups-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .12em;
  color: #6b7589;
  margin-bottom: 8px;
}
.dop-su-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  margin-bottom: 6px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: all .15s;
}
.dop-su-row:active { transform: scale(.98); }
.dop-su-row:hover { border-color: #95c11f; box-shadow: 0 4px 10px rgba(149,193,31,.15); }
.dop-su-ico {
  font-size: 1.4rem;
  flex-shrink: 0;
  width: 30px;
  text-align: center;
}
.dop-su-info { flex: 1; min-width: 0; }
.dop-su-title {
  font-size: .88rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dop-su-meta {
  font-size: .68rem;
  color: #6b7589;
  margin-top: 2px;
  font-weight: 600;
}
.dop-su-names {
  display: inline-block;
  margin-top: 2px;
  color: #5a8a1e;
  font-weight: 700;
}
.dop-su-count {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 10px;
  background: #f0fdf4;
  border-radius: 8px;
  min-width: 48px;
  flex-shrink: 0;
}
.dop-su-count b {
  font-size: 1.2rem;
  font-weight: 900;
  color: #5a8a1e;
  line-height: 1;
}
.dop-su-count span {
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .08em;
  color: #5a8a1e;
  text-transform: uppercase;
  margin-top: 2px;
}
.dop-su-count.empty {
  background: #f1f5f9;
}
.dop-su-count.empty b,
.dop-su-count.empty span { color: #94a3b8; }


/* ═══════════════════════════════════════════════════════════════
   DASHBOARD UPCOMING EVENTS — Twoje nadchodzące zapisy
   ═══════════════════════════════════════════════════════════════ */
.dash-upcoming {
  margin: 18px 0 4px;
  background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 70%);
  border: 1.5px solid #95c11f;
  border-radius: 16px;
  padding: 14px 16px 12px;
  box-shadow: 0 6px 22px rgba(149,193,31,.12);
}
.dash-up-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.dash-up-title {
  font-size: .82rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: .04em;
}
.dash-up-all {
  font-size: .72rem;
  background: transparent;
  border: 0;
  color: #5a8a1e;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.dash-up-list { display: flex; flex-direction: column; gap: 8px; }
.dash-up-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #ffffff;
  border: 1px solid #e0e9d2;
  border-radius: 12px;
  cursor: pointer;
  transition: all .15s;
}
.dash-up-card:hover { box-shadow: 0 4px 14px rgba(149,193,31,.18); border-color: #95c11f; }
.dash-up-card:active { transform: scale(.99); }

.dau-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  width: 56px;
}
.dau-ico {
  font-size: 1.5rem;
  line-height: 1;
}
.dau-day {
  font-size: .65rem;
  font-weight: 900;
  color: #5a8a1e;
  letter-spacing: .04em;
  background: #f0fdf4;
  padding: 2px 6px;
  border-radius: 5px;
}
.dau-body { flex: 1; min-width: 0; }
.dau-type {
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .12em;
  color: #94a3b8;
  margin-bottom: 2px;
}
.dau-title {
  font-size: .95rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dau-meta {
  font-size: .72rem;
  color: #6b7589;
  font-weight: 600;
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dau-chev {
  font-size: 1.4rem;
  color: #cbd5e1;
  font-weight: 900;
  flex-shrink: 0;
}
.dash-up-card:hover .dau-chev { color: #95c11f; }


/* ═══════════════════════════════════════════════════════════════
   SIGNUP LIST MODAL (Owner: zobacz kto się zapisał) — premium
   ═══════════════════════════════════════════════════════════════ */
.sl-sheet {
  max-height: 80vh;
  display: flex;
  flex-direction: column;
}
.sl-head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 0 18px;
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 12px;
}
.sl-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #95c11f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14);
  flex-shrink: 0;
}
.sl-title-wrap { flex: 1; min-width: 0; }
.sl-title {
  font-size: 1.15rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.02em;
}
.sl-sub {
  font-size: .82rem;
  color: #6b7589;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sl-list {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.sl-empty {
  text-align: center;
  padding: 40px 16px;
  color: #94a3b8;
  font-size: .9rem;
}
.sl-empty-ico { font-size: 3rem; opacity: .5; margin-bottom: 10px; }

.sl-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
}
.sl-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #95c11f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: .9rem;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(149,193,31,.3);
}
.sl-info { flex: 1; min-width: 0; }
.sl-name {
  font-size: .95rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.sl-meta {
  display: flex;
  gap: 10px;
  margin-top: 2px;
  flex-wrap: wrap;
}
.sl-contact {
  font-size: .76rem;
  color: #2a3a4d;
  text-decoration: none;
  font-weight: 600;
}
.sl-contact:hover { color: #5a8a1e; }
.sl-when {
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 700;
  flex-shrink: 0;
}
.sl-close { margin-top: 8px; }

/* Signup row — PREMIUM (jasne tło, contrast) */
.tp-signup-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  margin-bottom: 12px;
  box-shadow: 0 2px 8px rgba(15,23,42,.06);
}
.tp-signup-btn {
  flex: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 18px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 12px;
  font-size: .9rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: -.01em;
  -webkit-tap-highlight-color: transparent;
  font-family: inherit;
  box-shadow: 0 4px 12px -3px rgba(149,193,31,.45);
  transition: background .15s, transform .1s;
  text-transform: none;
}
.tp-signup-btn svg { width: 16px !important; height: 16px !important; stroke: currentColor; fill: none; flex-shrink: 0; }
.tp-signup-btn:active { transform: scale(.97); }
.tp-signup-btn:hover { background: #88b31c; }
.tp-signup-btn.signed {
  background: #f0fdf4;
  color: #5a8a1e;
  border: 2px solid #95c11f;
  box-shadow: none;
}
.tp-signup-btn.signed:hover {
  background: #fee2e2;
  color: #b91c1c;
  border-color: #ef4444;
}
.tp-signup-btn.signed:hover::after {
  content: ' (kliknij by wypisać)';
  font-size: .75rem;
  font-weight: 600;
  opacity: .8;
}
.tp-signup-count {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  font-size: .65rem;
  color: #6b7589;
  font-weight: 800;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 10px 14px;
  background: #f8fafc;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 12px;
  cursor: default;
  min-width: 64px;
}
.tp-signup-count svg { width: 15px !important; height: 15px !important; stroke: #94a3b8; fill: none; margin-bottom: 2px; }
.tp-link-btn svg { width: 15px !important; height: 15px !important; stroke: currentColor; fill: none; flex-shrink: 0; }
.tp-signup-count b {
  font-size: 1.6rem;
  font-weight: 900;
  color: #1d2a3a;
  display: block;
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 2px;
}
.tp-signup-view {
  display: block;
  margin-top: 4px;
  font-size: .58rem;
  color: #5a8a1e;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: .04em;
  text-transform: none;
}
.tp-signup-view:hover { text-decoration: underline; }

/* Link button */
.tp-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  background: #1d2a3a;
  color: #fff !important;
  border-radius: 10px;
  font-size: .85rem;
  font-weight: 700;
  text-decoration: none !important;
  margin-bottom: 14px;
  box-shadow: none;
  transition: all .15s;
}
.tp-link-btn:active { transform: scale(.97); }
.tp-link-btn:hover {
  box-shadow: 0 2px 8px -2px rgba(15,23,42,.14);
  background: #95c11f;
}

.tp-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px solid #e5e7eb;
  font-size: .76rem;
  gap: 10px;
}
.tp-loc {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #6b7589;
  font-weight: 700;
}
/* Klikalna lokalizacja → Google Maps */
.tp-loc-link {
  text-decoration: none !important;
  color: #1d2a3a !important;
  padding: 5px 10px;
  background: #f1f5f9;
  border-radius: 8px;
  transition: all .15s;
}
.tp-loc-link:hover {
  background: #e0f2fe;
  color: #0369a1 !important;
}
.tp-loc-link:active { transform: scale(.97); }
.tp-loc-link svg { color: #ef4444; }   /* czerwony pin Google */
.tp-maps-hint {
  margin-left: 4px;
  font-size: .7rem;
  color: #94a3b8;
  font-weight: 600;
}
.tp-loc-link:hover .tp-maps-hint { color: #0369a1; }

.tp-author {
  color: #94a3b8;
  font-weight: 600;
}
.tp-author b {
  color: #1d2a3a;
  font-weight: 800;
}

/* form-textarea (gdy potrzebne) */
.form-textarea {
  width: 100%;
  padding: 11px 14px;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  font-size: .92rem;
  font-family: inherit;
  resize: vertical;
  min-height: 80px;
  box-sizing: border-box;
}
.form-textarea:focus { outline: none; border-color: #95c11f; }

.modal-sub {
  font-size: .82rem;
  color: #6b7589;
  margin: -8px 0 16px;
}
.tab-readonly-hint {
  background: #f0fdf4;
  border-left: 3px solid #95c11f;
  padding: 10px 14px;
  border-radius: 0 8px 8px 0;
  font-size: .82rem;
  color: #2a3a4d;
  margin-bottom: 14px;
  font-weight: 600;
}

/* ── PROFILE QUICK GRID — Szkolenia / Tablica / Serwis ── */
.profile-quick-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  margin: 16px 0;
}
.pqg-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 8px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  cursor: pointer;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  transition: all .15s;
}
.pqg-card:active { transform: scale(.95); }
.pqg-card:hover { border-color: #95c11f; box-shadow: 0 4px 12px rgba(149,193,31,.15); }
.pqg-ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pqg-title {
  font-size: .85rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.pqg-sub {
  font-size: .65rem;
  color: #94a3b8;
  font-weight: 600;
  text-align: center;
}

/* Karta która właśnie przyszła z akceptacji — celebracja */
.lead-card.lead-just-moved {
  animation: leadJustMoved 1.8s cubic-bezier(.34, 1.56, .64, 1);
}
@keyframes leadJustMoved {
  0%   { transform: scale(.85) translateY(20px); opacity: 0; }
  30%  { transform: scale(1.04) translateY(-4px); opacity: 1; box-shadow: 0 14px 40px rgba(149,193,31,.55), 0 0 0 6px rgba(149,193,31,.25); }
  60%  { transform: scale(1); box-shadow: 0 10px 30px rgba(149,193,31,.40), 0 0 0 4px rgba(149,193,31,.18); }
  100% { transform: scale(1); }
}

/* ===== Bottom Nav ===== */
/* iOS-style tab bar — translucent z backdrop-filter (Apple) */
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 200;
  display: flex;
  align-items: stretch;
  height: calc(var(--nav-height) + var(--safe-bottom));
  padding-bottom: var(--safe-bottom);
  background: rgba(255,255,255,.85);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-top: .5px solid rgba(15,23,42,.08);
  box-shadow: none;
}

.nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  font-size: .6rem;
  font-weight: 500;
  color: #9ca3af;
  text-decoration: none;
  cursor: pointer;
  transition: color .2s ease;
  position: relative;
  -webkit-user-select: none;
  user-select: none;
  padding: 0 2px;
}

/* Apple iOS tab bar — outline always, kolor + subtelny "pill" backdrop dla aktywnego */
.nav-item .nav-ico-outline,
.nav-item .nav-ico-solid {
  width: 24px;
  height: 24px;
  transition: stroke .2s ease, fill .2s ease, transform .2s ease;
}
.nav-item .nav-ico-outline {
  display: block;
  stroke: #9ca3af;
  fill: none;
  stroke-width: 1.6;
}
.nav-item .nav-ico-solid {
  display: none;
}
/* Aktywny — outline ZIELONA (nie solid filled) — bardziej elegancko */
.nav-item.active .nav-ico-outline {
  display: block;
  stroke: #1d2a3a;          /* granat — Apple używa primary color */
  stroke-width: 2;          /* odrobinę grubsza linia = "selected" */
}
.nav-item:active .nav-ico-outline { transform: scale(.92); }

.nav-item.active {
  color: #1d2a3a;
  font-weight: 600;
}
/* JEDEN wskaźnik aktywnego: subtelny zielony „pill" za ikoną (Material/iOS) */
.nav-item.active::before {
  content: '';
  position: absolute;
  top: 5px;
  left: 50%;
  transform: translateX(-50%);
  width: 50px;
  height: 30px;
  border-radius: 11px;
  background: rgba(149,193,31,.15);
  z-index: 0;
}
.nav-item .nav-ico-outline,
.nav-item .nav-ico-solid,
.nav-item > span:not(.nav-badge) { position: relative; z-index: 1; }

.nav-item.active::after { display: none; }

.nav-badge {
  position: absolute;
  top: 2px;
  right: calc(50% - 20px);
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  background: #e30613;
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border: 2px solid #ffffff;
  box-shadow: 0 1px 3px rgba(227,6,19,.3);
}

.nav-item .badge {
  position: absolute;
  top: 4px;
  right: calc(50% - 18px);
  min-width: 16px;
  height: 16px;
  border-radius: 8px;
  background: var(--danger);
  color: #fff;
  font-size: .6rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}

/* ===== Page Sections — premium fade+slide transition ===== */
.page { display: none; padding: 16px; }
.page.active {
  display: block;
  animation: pageEnter .35s cubic-bezier(.16,1,.3,1);
  will-change: opacity, transform;
}

@keyframes pageEnter {
  0% { opacity: 0; transform: translateY(12px) scale(.99); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Stagger animation dla cards na page — pojawiają się z lekkim opóźnieniem */
.page.active .lead-card,
.page.active .stat-tile,
.page.active .crm-pool-bar {
  animation: cardSlideIn .4s cubic-bezier(.16,1,.3,1) backwards;
}
.page.active .lead-card:nth-child(1) { animation-delay: .03s; }
.page.active .lead-card:nth-child(2) { animation-delay: .06s; }
.page.active .lead-card:nth-child(3) { animation-delay: .09s; }
.page.active .lead-card:nth-child(4) { animation-delay: .12s; }
.page.active .lead-card:nth-child(5) { animation-delay: .15s; }
.page.active .lead-card:nth-child(n+6) { animation-delay: .18s; }

@keyframes cardSlideIn {
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ===== Cards ===== */
.card {
  background: var(--card);
  border-radius: var(--radius);
  padding: 18px;
  margin-bottom: 14px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,0,0,.04);
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.card-title {
  font-size: 1rem;
  font-weight: 700;
}

.card-subtitle {
  font-size: .8rem;
  color: var(--text-light);
  margin-top: 2px;
}

/* ===== Stat Grid ===== */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}

.stat-card {
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 16px;
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  text-align: center;
}

.stat-card .stat-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 8px;
  font-size: 1.2rem;
}

.stat-card .stat-value {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.2;
}

.stat-card .stat-label {
  font-size: .72rem;
  color: var(--text-light);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: .3px;
}

/* stat icon colors — przemapowane na DiBO palette */
.stat-icon.red    { background: #fde8ea; color: var(--danger); }
.stat-icon.green  { background: var(--green-light); color: var(--green); }
.stat-icon.blue   { background: var(--green-light); color: var(--green); }
.stat-icon.orange { background: #fff3e0; color: var(--orange); }
.stat-icon.granat { background: #e8ebf0; color: var(--primary); }

/* ===== Buttons ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 12px 20px;
  border-radius: 12px;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: -.01em;
  border: none;
  cursor: pointer;
  transition: background .15s, transform .12s, border-color .15s;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

.btn:active { transform: scale(.97); }

/* Zielony przycisk = granatowy tekst (wysoki kontrast, premium) */
.btn-primary {
  background: var(--accent);
  color: #1d2a3a;
}
.btn-primary:hover { background: var(--accent-hover); }

.btn-secondary {
  background: var(--primary);
  color: #fff;
}

.btn-outline {
  background: transparent;
  color: #1d2a3a;
  border: 1px solid hsl(240 5.9% 86%);
}
.btn-outline:hover { border-color: var(--accent); color: #5a8a1e; }

.btn-green {
  background: var(--green);
  color: #1d2a3a;
}

.btn-blue {
  background: var(--blue);
  color: #1d2a3a;
}

.btn-purple {
  background: var(--purple);
  color: #fff;
}

.btn-danger {
  background: var(--danger);
  color: #fff;
}
.btn-danger:hover { background: var(--danger-hover); }

.btn-outline-danger {
  background: transparent;
  color: var(--danger);
  border: 1.5px solid var(--danger);
}

.btn-sm {
  padding: 7px 14px;
  font-size: .78rem;
  border-radius: 10px;
}

.btn-block {
  width: 100%;
}

.btn-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* ===== Section Title ===== */
.section-title {
  font-size: 1.12rem;
  font-weight: 800;
  letter-spacing: -.025em;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.section-title .icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .85rem;
  flex-shrink: 0;
}

/* ===== Lists ===== */
.list-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: opacity .15s;
  -webkit-tap-highlight-color: transparent;
}

.list-item:last-child { border-bottom: none; }

.list-item:active { opacity: .65; }

.list-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: .85rem;
  flex-shrink: 0;
}

.list-content {
  flex: 1;
  min-width: 0;
}

.list-title {
  font-weight: 600;
  font-size: .9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: -.01em;
}

.list-desc {
  font-size: .78rem;
  color: var(--text-light);
  margin-top: 2px;
}

.list-meta {
  font-size: .72rem;
  color: var(--text-light);
  text-align: right;
  flex-shrink: 0;
}

/* ===== Tags / Badges ===== */
.tag {
  display: inline-block;
  padding: 4px 11px;
  border-radius: 20px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .01em;
}

.tag-green  { background: var(--green-light); color: var(--green); }
.tag-red    { background: #fde8ea; color: var(--danger); }
.tag-orange { background: #fff3e0; color: var(--orange); }
.tag-blue   { background: var(--green-light); color: var(--green); }
.tag-gray   { background: #f3f4f6; color: var(--text-light); }
.tag-granat { background: #e8ebf0; color: var(--primary); }

/* ===== Stars ===== */
.stars {
  color: #fbbf24;
  font-size: 1rem;
  letter-spacing: 1px;
}

.stars .empty { color: #d1d5db; }

/* ===== Progress Bar ===== */
.progress-bar {
  height: 8px;
  background: #e5e7eb;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 6px;
}

.progress-fill {
  height: 100%;
  border-radius: 4px;
  transition: width .5s ease;
}

.progress-fill.green  { background: var(--green); }
.progress-fill.red    { background: var(--danger); }
.progress-fill.blue   { background: var(--green); }
.progress-fill.orange { background: var(--orange); }

/* ===== Review Card ===== */
/* ===== Trust — Google Reviews Dashboard ===== */
.trust-google-panel {
  background: #fff; border-radius: 18px; padding: 16px;
  margin-bottom: 14px; border: 1.5px solid #e8eaed;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.trust-g-top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.trust-g-logo {
  width: 42px; height: 42px; border-radius: 12px; background: #f0f4f8;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.trust-g-info { flex: 1; min-width: 0; }
.trust-g-name { font-weight: 800; font-size: .92rem; color: var(--text); }
.trust-g-status { font-size: .65rem; color: #999; margin-top: 1px; }
.trust-g-rating-box { text-align: center; flex-shrink: 0; }
.trust-g-score { font-size: 1.8rem; font-weight: 900; color: var(--text); line-height: 1; }
.trust-g-stars { font-size: .7rem; color: #fbbf24; margin-top: 2px; letter-spacing: 1px; }
.trust-g-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  margin-bottom: 12px;
}
.trust-g-stat {
  background: #f8f9fb; border-radius: 10px; padding: 10px 6px; text-align: center;
}
.trust-g-stat-num { font-size: 1.15rem; font-weight: 900; color: var(--text); }
.trust-g-stat-label { font-size: .55rem; color: #999; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-top: 2px; }
.trust-g-link {
  display: flex; align-items: center; gap: 6px; justify-content: center;
  padding: 10px; border-radius: 10px; background: #e8f5e9;
  color: #2d9b4e; font-size: .72rem; font-weight: 700;
  text-decoration: none; transition: background .15s;
}
.trust-g-link:active { background: #c8e6c9; }
.trust-g-link.not-set { background: #fff3e0; color: #f77f00; }

/* Auto-review section */
.trust-auto-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 10px; padding: 0 2px;
}
.trust-auto-title { font-weight: 800; font-size: .85rem; color: var(--text); }
.trust-auto-badge {
  background: #e63946; color: #fff; font-size: .6rem; font-weight: 800;
  padding: 3px 10px; border-radius: 10px;
}

/* Trust pending card */
.trust-pending-card {
  background: #fff; border: 1.5px solid #eef0f3; border-radius: 14px;
  padding: 12px 14px; margin-bottom: 8px;
  display: flex; align-items: center; gap: 12px;
}
.trust-pending-card:active { transform: scale(.985); }
.trust-pending-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .82rem; flex-shrink: 0;
}
.trust-pending-info { flex: 1; min-width: 0; }
.trust-pending-name { font-weight: 700; font-size: .82rem; }
.trust-pending-desc { font-size: .65rem; color: #999; margin-top: 2px; }
/* old trust-send-btn moved to section cards block below */

/* Section labels */
.trust-section-label {
  display: flex; align-items: center; justify-content: space-between;
  margin: 16px 0 8px; padding: 0 2px;
  font-weight: 800; font-size: .78rem; color: var(--text);
}
.trust-sent-count {
  background: #e8f5e9; color: #2d9b4e; font-size: .6rem;
  font-weight: 800; padding: 2px 8px; border-radius: 8px;
}

/* Review cards - improved */
.review-card {
  background: #fff; border-radius: 14px; padding: 12px 14px;
  margin-bottom: 8px; border: 1.5px solid #eef0f3;
}
.review-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.review-platform { font-size: .6rem; font-weight: 700; padding: 3px 8px; border-radius: 8px; }
.platform-google { background: #e8f5e9; color: #1b5e20; }
.platform-fb { background: #e3f2fd; color: #1565c0; }
.review-text { font-size: .8rem; line-height: 1.5; color: var(--text); }
.review-author { font-size: .68rem; color: #999; margin-top: 6px; }

/* Trust empty state */
.trust-empty {
  text-align: center; padding: 30px 16px; color: #bbb;
}
.trust-empty-icon { font-size: 2.5rem; margin-bottom: 8px; }
.trust-empty-title { font-weight: 700; font-size: .88rem; color: #999; }
.trust-empty-desc { font-size: .72rem; margin-top: 4px; }

/* ── Trust Section Cards ── */
/* Trust — Google API + Profile Analysis cards */
.trust-gapi-card, .trust-profile-analysis-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 14px;
  margin-bottom: 10px; border: 1.5px solid var(--border);
}
.trust-gapi-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.trust-gapi-icon {
  width: 38px; height: 38px; border-radius: 12px; flex-shrink: 0;
  background: linear-gradient(135deg, #4285f4, #1a73e8);
  display: flex; align-items: center; justify-content: center;
}
.trust-gapi-title { font-weight: 800; font-size: .88rem; }
.trust-gapi-sub { font-size: .68rem; color: var(--text-light); margin-top: 2px; }
.trust-gapi-row { display: flex; gap: 8px; align-items: center; }
.trust-gapi-btn {
  display: flex; align-items: center; gap: 5px;
  background: var(--primary); color: #fff; border: none; border-radius: 10px;
  padding: 10px 14px; font-size: .75rem; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.trust-profile-ai-btn {
  width: 100%; background: linear-gradient(135deg, #8b5cf6, #5b21b6);
  color: #fff; border: none; border-radius: 12px;
  padding: 12px; font-weight: 700; font-size: .84rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 7px;
  transition: transform .15s;
}
.trust-profile-ai-btn:active { transform: scale(.97); }
.trust-ai-analysis { font-size: .8rem; line-height: 1.65; color: #333; }
.trust-ai-tip { display: flex; gap: 8px; padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
.trust-ai-tip:last-child { border-bottom: none; }
.trust-ai-tip-icon { font-size: 1.1rem; flex-shrink: 0; }

.trust-section-card {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1.5px solid var(--border);
  padding: 14px 16px;
  margin-bottom: 12px;
}
.trust-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.trust-section-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.trust-section-title {
  font-weight: 800;
  font-size: .88rem;
  color: var(--text);
  line-height: 1.2;
}
.trust-section-desc {
  font-size: .7rem;
  color: var(--text-light);
  margin-top: 1px;
}

/* Improved AI Send buttons in Trust */
.trust-send-btn {
  border: none; border-radius: 12px; padding: 9px 16px;
  font-weight: 700; font-size: .72rem; cursor: pointer;
  display: flex; align-items: center; gap: 6px; flex-shrink: 0;
  transition: transform .1s, box-shadow .15s;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  letter-spacing: .01em;
}
.trust-send-btn:active { transform: scale(.93); }
.trust-send-btn svg { flex-shrink: 0; }

/* ===== Form ===== */
.form-group {
  margin-bottom: 14px;
}

.form-label {
  display: block;
  font-size: .8rem;
  font-weight: 700;
  margin-bottom: 6px;
  color: var(--text);
  letter-spacing: -.01em;
}

.form-input, .form-textarea, .form-select {
  width: 100%;
  padding: 11px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .88rem;
  font-family: inherit;
  background: #fff;
  color: var(--text);
  transition: border-color .2s, box-shadow .2s;
  -webkit-appearance: none;
}

.form-input:focus, .form-textarea:focus, .form-select:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(46,163,242,.12);
}

.form-textarea {
  resize: vertical;
  min-height: 80px;
}

/* ===== Tabs (iOS Segmented Control) ===== */
.tabs {
  display: flex;
  gap: 2px;
  background: rgba(118,118,128,.12);
  border-radius: var(--radius-sm);
  padding: 3px;
  margin-bottom: 14px;
}

.tab {
  flex: 1;
  padding: 8px 6px;
  text-align: center;
  font-size: .76rem;
  font-weight: 600;
  border-radius: 10px;
  cursor: pointer;
  color: var(--text-light);
  transition: all .18s;
  -webkit-tap-highlight-color: transparent;
  letter-spacing: -.01em;
}

.tab.active {
  background: #fff;
  color: var(--text);
  box-shadow: 0 1px 4px rgba(0,0,0,.12), 0 0 1px rgba(0,0,0,.06);
  font-weight: 700;
}

/* ===== Video Embed ===== */
.video-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: #000;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-card {
  overflow: hidden;
}

/* ===== Map Container ===== */
.map-container {
  width: 100%;
  height: 300px;
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 14px;
  border: 1px solid var(--border);
  position: relative;
  background: #e8ecf1;
}

.map-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--text-light);
}

.map-placeholder svg {
  width: 48px;
  height: 48px;
  opacity: .5;
}

/* ===== Course Card ===== */
.course-card {
  display: flex;
  gap: 12px;
  padding: 14px;
  background: var(--card);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  margin-bottom: 10px;
  cursor: pointer;
}

.course-thumb {
  width: 80px;
  height: 60px;
  border-radius: 8px;
  background: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.3rem;
  flex-shrink: 0;
}

.course-info { flex: 1; }

.course-title {
  font-weight: 600;
  font-size: .9rem;
  margin-bottom: 4px;
}

.course-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .72rem;
  color: var(--text-light);
}

/* ===== Material Card ===== */
.material-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  background: var(--card);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  margin-bottom: 10px;
  cursor: pointer;
}

.material-icon {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  flex-shrink: 0;
}

.material-info { flex: 1; min-width: 0; }

.material-title {
  font-weight: 600;
  font-size: .88rem;
}

.material-desc {
  font-size: .75rem;
  color: var(--text-light);
  margin-top: 2px;
}

/* ===== Quick Actions ===== */
.quick-actions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}

.quick-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 6px;
  background: var(--card);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  text-decoration: none;
  color: var(--text);
}

.quick-action:active {
  transform: scale(.95);
}

.quick-action .qa-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}

.quick-action .qa-label {
  font-size: .68rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.2;
}

/* ===== Empty State ===== */
.empty-state {
  text-align: center;
  padding: 40px 20px;
  color: var(--text-light);
}

.empty-state svg {
  width: 64px;
  height: 64px;
  opacity: .3;
  margin-bottom: 12px;
}

.empty-state p {
  font-size: .88rem;
}

/* ===== Modal / Sheet ===== */
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(0,0,0,.4);
  align-items: flex-end;
  justify-content: center;
  animation: fadeInOverlay .2s ease;
}

.modal-overlay.show {
  display: flex;
}

@keyframes fadeInOverlay {
  from { opacity: 0; }
  to { opacity: 1; }
}

.modal-sheet {
  background: var(--card);
  border-radius: 22px 22px 0 0;
  width: 100%;
  max-width: 500px;
  /* iOS PWA: subtract status-bar height so sheet never goes under it */
  max-height: calc(94dvh - env(safe-area-inset-top, 0px));
  overflow-y: auto;
  /* bottom padding accounts for home indicator */
  padding: 20px 20px max(20px, calc(16px + env(safe-area-inset-bottom, 0px)));
  animation: slideUp .22s cubic-bezier(.32,.72,0,1);
  /* iOS momentum scroll */
  -webkit-overflow-scrolling: touch;
}

@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

.modal-handle {
  width: 40px;
  height: 4px;
  background: #d1d5db;
  border-radius: 2px;
  margin: 0 auto 16px;
}

.modal-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 16px;
}

/* ===== Toast ===== */
.toast {
  position: fixed;
  top: 70px;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  background: var(--primary);
  color: #fff;
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  font-size: .85rem;
  font-weight: 600;
  z-index: 600;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s, transform .3s;
  box-shadow: var(--shadow-lg);
}

.toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}

/* Toast z przyciskiem Cofnij */
.toast.toast-undo {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 14px 12px 20px;
  background: #1d2a3a;
  border: 1px solid rgba(149,193,31,.25);
  box-shadow: 0 12px 32px rgba(15,23,42,.4);
}
.toast-msg { flex: 1; }
.toast-undo-btn {
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  padding: 7px 14px;
  border-radius: 10px;
  font-weight: 900;
  font-size: .82rem;
  cursor: pointer;
  letter-spacing: .02em;
  text-transform: uppercase;
  font-family: inherit;
  box-shadow: 0 4px 10px rgba(149,193,31,.35);
}
.toast-undo-btn:active { transform: scale(.95); }

/* ===== Checklist ===== */
.checklist-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

.checklist-item:last-child { border-bottom: none; }

.checklist-check {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid var(--border);
  flex-shrink: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s;
  margin-top: 1px;
}

.checklist-check.checked {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.checklist-text {
  font-size: .85rem;
  line-height: 1.4;
}

.checklist-text.done {
  text-decoration: line-through;
  color: var(--text-light);
}

/* ===== Scroll Horizontal ===== */
.scroll-h {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
  margin: 0 -16px;
  padding-left: 16px;
  padding-right: 16px;
}

.scroll-h::-webkit-scrollbar { display: none; }

.scroll-h > * {
  scroll-snap-align: start;
  flex-shrink: 0;
}

/* ===== Booking Slot ===== */
.slot {
  padding: 10px 16px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--border);
  text-align: center;
  cursor: pointer;
  transition: all .2s;
  min-width: 90px;
}

.slot:hover, .slot.selected {
  border-color: var(--accent);
  background: #fde8ea;
}

.slot .slot-time {
  font-weight: 700;
  font-size: .9rem;
}

.slot .slot-label {
  font-size: .68rem;
  color: var(--text-light);
  margin-top: 2px;
}

/* ===== Utility ===== */
.mt-8 { margin-top: 8px; }
.mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.text-center { text-align: center; }
.text-accent { color: var(--accent); }
.text-green { color: var(--green); }
.text-light { color: var(--text-light); }
.fw-700 { font-weight: 700; }
.fs-sm { font-size: .8rem; }
.flex { display: flex; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }

/* ===== MOBILE LOCK — app always looks native mobile ===== */
body {
  max-width: 500px;
  margin: 0 auto;
  position: relative;
}

@media (min-width: 600px) {
  body { box-shadow: 0 0 30px rgba(0,0,0,.15); min-height: 100dvh; }
  .app-header { max-width: 500px; margin: 0 auto; left: 0; right: 0; }
  .bottom-nav { max-width: 500px; left: 50%; transform: translateX(-50%); border-radius: 16px 16px 0 0; }
  .modal-sheet { max-width: 500px; }
  .toast { max-width: 400px; }
  .preloader { max-width: 500px; left: 50%; transform: translateX(-50%); }
}

/* ===== Preloader / Splash ===== */
/* ═══════════════════════════════════════════════════════════════
   PRELOADER — premium DiBO splash z animowanymi orbami i pulse
   ═══════════════════════════════════════════════════════════════ */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: radial-gradient(ellipse at top, #243447 0%, #1d2a3a 40%, #131c28 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: opacity .6s ease, visibility .6s ease;
}
.preloader.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Animated background orbs (subtle green glow) */
.preloader-bg-orbs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.preloader-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: .35;
  animation: orbFloat 8s ease-in-out infinite;
}
.preloader-orb.orb-1 {
  top: -10%;
  left: -10%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, #95c11f 0%, transparent 70%);
}
.preloader-orb.orb-2 {
  bottom: -15%;
  right: -10%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, #7cb342 0%, transparent 70%);
  animation-delay: -3s;
  animation-duration: 10s;
}
.preloader-orb.orb-3 {
  top: 40%;
  left: 60%;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, #e30613 0%, transparent 65%);
  opacity: .2;
  animation-delay: -5s;
  animation-duration: 12s;
}
@keyframes orbFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%      { transform: translate(30px, -40px) scale(1.1); }
  66%      { transform: translate(-20px, 30px) scale(.95); }
}

.preloader-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 32px;
}

/* Badge z pulsującymi pierścieniami */
.preloader-badge-wrap {
  position: relative;
  width: 140px;
  height: 140px;
  margin-bottom: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.preloader-badge {
  width: 140px;
  height: 140px;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(149,193,31,.35));
  animation: badgeBreathe 2.5s ease-in-out infinite;
  position: relative;
  z-index: 2;
}
@keyframes badgeBreathe {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.04); }
}
.preloader-pulse-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid #95c11f;
  opacity: 0;
  animation: pulseRing 2.2s ease-out infinite;
}
.preloader-pulse-ring.r2 { animation-delay: 1.1s; }
@keyframes pulseRing {
  0%   { transform: scale(.9); opacity: .6; }
  100% { transform: scale(1.7); opacity: 0; }
}

/* Brand text */
.preloader-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 14px;
}
.pb-amb {
  font-size: .92rem;
  font-weight: 800;
  letter-spacing: .35em;
  color: rgba(255,255,255,.85);
  text-transform: uppercase;
  margin-bottom: 6px;
}
.pb-dibo {
  font-size: 3.4rem;
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1;
  background: linear-gradient(135deg, #fff 0%, #d1f0c2 50%, #95c11f 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 40px rgba(149,193,31,.4);
}

/* Tagline */
.preloader-tagline {
  font-size: .98rem;
  color: rgba(255,255,255,.7);
  margin-bottom: 36px;
  display: flex;
  gap: 6px;
  font-weight: 500;
}
.pt-green {
  color: #95c11f;
  font-weight: 800;
  text-shadow: 0 0 16px rgba(149,193,31,.6);
}

/* Progress bar zamiast spinnera */
.preloader-progress {
  width: 220px;
  height: 4px;
  background: rgba(255,255,255,.08);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 18px;
}
.preloader-progress-bar {
  width: 30%;
  height: 100%;
  background: linear-gradient(90deg, #95c11f 0%, #7cb342 100%);
  border-radius: 4px;
  animation: progressSlide 1.4s ease-in-out infinite;
  box-shadow: 0 0 12px rgba(149,193,31,.6);
}
@keyframes progressSlide {
  0%   { transform: translateX(-100%); width: 30%; }
  50%  { width: 50%; }
  100% { transform: translateX(400%); width: 30%; }
}

.preloader-hashtag {
  font-size: .72rem;
  color: rgba(149,193,31,.7);
  letter-spacing: .25em;
  font-weight: 700;
  text-transform: lowercase;
}

/* Legacy spinner support */
@keyframes spin { to { transform: rotate(360deg); } }

/* ===== Splash / Install prompt ===== */
.install-banner {
  display: none;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  color: #fff;
  font-size: .85rem;
  cursor: pointer;
}

.install-banner .close-btn {
  margin-left: auto;
  background: none;
  border: none;
  color: rgba(255,255,255,.7);
  font-size: 1.2rem;
  cursor: pointer;
}

/* ===== MAP PAGE ===== */
.map-controls-strip {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: var(--card);
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin: 0 -16px 14px;
  flex-wrap: nowrap;
}
.map-controls-strip::-webkit-scrollbar { display: none; }

.map-ctrl-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border: 1.5px solid var(--border);
  border-radius: 20px;
  background: #fff;
  color: var(--text);
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: opacity .15s, background .15s;
  -webkit-tap-highlight-color: transparent;
}
.map-ctrl-btn:active { opacity: .7; }
.map-ctrl-location {
  background: var(--blue);
  color: #fff;
  border-color: var(--blue);
}
.map-ctrl-refresh {
  width: 34px;
  height: 34px;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
  margin-left: auto;
  flex-shrink: 0;
}

.map-route-section {
  background: var(--card);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,0,0,.04);
}

.map-section-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .88rem;
  font-weight: 800;
  letter-spacing: -.02em;
  margin-bottom: 12px;
}

/* ===== Ambassador Network List ===== */
.amb-net-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--card);
  border-radius: var(--radius);
  margin-bottom: 8px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,0,0,.04);
  cursor: pointer;
  transition: transform .12s, opacity .15s;
  -webkit-tap-highlight-color: transparent;
}
.amb-net-card:active { transform: scale(.98); opacity: .8; }

.amb-net-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: .75rem;
  font-weight: 800;
  flex-shrink: 0;
  position: relative;
}
.amb-net-dot {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 2px solid var(--bg);
}
.amb-net-info { flex: 1; min-width: 0; }
.amb-net-name {
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: -.02em;
}
.amb-net-city {
  font-size: .72rem;
  color: var(--text-light);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.amb-net-status {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex-shrink: 0;
}
.amb-net-badge {
  font-size: .65rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 10px;
}
.amb-net-badge.available { background: #e8f5e9; color: #27ae60; }
.amb-net-badge.busy { background: #f3f4f6; color: #9ca3af; }
.amb-net-call {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #e8f5e9;
  color: var(--green);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background .15s;
}
.amb-net-call:active { background: var(--green); color: #fff; }

/* ===== Exchange / Giełda ===== */
.exc-card {
  background: var(--card);
  border-radius: var(--radius);
  padding: 15px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,0,0,.04);
}
.exc-card-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}
.exc-card-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .7rem;
  font-weight: 800;
  flex-shrink: 0;
}
.exc-card-meta { flex: 1; min-width: 0; }
.exc-card-author {
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: -.01em;
}
.exc-card-loc {
  font-size: .7rem;
  color: var(--text-light);
  display: flex;
  align-items: center;
  gap: 3px;
  margin-top: 2px;
}
.exc-type-badge {
  font-size: .62rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
.exc-card-service {
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: -.02em;
  margin-bottom: 5px;
}
.exc-card-desc {
  font-size: .78rem;
  color: var(--text-light);
  line-height: 1.45;
  margin-bottom: 12px;
}
.exc-card-actions {
  display: flex;
  gap: 7px;
}
.exc-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border-radius: 10px;
  font-size: .75rem;
  font-weight: 700;
  cursor: pointer;
  border: none;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: opacity .15s;
}
.exc-action-btn:active { opacity: .7; }
.exc-call { background: var(--green); color: #fff; flex: 1; justify-content: center; }
.exc-sms { background: var(--primary); color: #fff; flex: 1; justify-content: center; }
.exc-close { background: #f3f4f6; color: var(--text-light); padding: 7px 10px; }

/* Exchange type chip selector */
.exc-type-chip {
  padding: 7px 14px;
  border-radius: 10px;
  border: 1.5px solid var(--border);
  background: #f9fafb;
  color: var(--text-light);
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  -webkit-tap-highlight-color: transparent;
}
.exc-type-chip.active { font-weight: 700; }

/* ===== Leaflet Map Overrides ===== */
#leafletMap .leaflet-popup-content-wrapper {
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
}

#leafletMap .leaflet-popup-content {
  margin: 14px 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: .85rem;
  line-height: 1.5;
}

.ambassador-popup {
  text-align: center;
}

.ambassador-popup strong {
  font-size: .95rem;
  display: block;
  margin-bottom: 4px;
}

.ambassador-popup .popup-stars {
  color: #fbbf24;
}

.ambassador-popup .popup-tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: .7rem;
  font-weight: 600;
  margin-top: 4px;
}

.popup-tag.available { background: var(--green-light); color: var(--green); }
.popup-tag.busy { background: #fff3e0; color: var(--orange); }

/* ===== Marketing Module ===== */
.marketing-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}

.marketing-card {
  background: var(--card);
  border-radius: var(--radius-sm);
  padding: 16px 12px;
  text-align: center;
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}

.marketing-card:active {
  transform: scale(.96);
}

.marketing-card .mc-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 8px;
  font-size: 1.3rem;
}

.marketing-card .mc-title {
  font-weight: 700;
  font-size: .82rem;
  line-height: 1.3;
}

.marketing-card .mc-desc {
  font-size: .68rem;
  color: var(--text-light);
  margin-top: 3px;
}

/* ── Social Media Hub ── */
.sm-hub-card {
  background: #1a2332;
  border-radius: var(--radius);
  padding: 18px 16px;
  margin-bottom: 12px;
  color: #fff;
}
.sm-hub-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 16px;
}
.sm-hub-icon {
  width: 42px; height: 42px; border-radius: 12px;
  background: linear-gradient(135deg, #2196f3, #1565c0);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 2px 8px rgba(33,150,243,.3);
}
.sm-hub-title { font-weight: 800; font-size: .95rem; }
.sm-hub-sub { font-size: .7rem; color: rgba(255,255,255,.6); margin-top: 1px; }

.sm-connected-list { display: flex; flex-direction: column; gap: 8px; }

.sm-account {
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,.08); border-radius: 12px;
  padding: 10px 12px; transition: background .15s;
}
.sm-account:active { background: rgba(255,255,255,.14); }
.sm-account-icon {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-size: 1rem;
}
.sm-account-info { flex: 1; min-width: 0; }
.sm-account-name { font-weight: 700; font-size: .82rem; }
.sm-account-handle { font-size: .68rem; color: rgba(255,255,255,.5); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sm-account-status {
  font-size: .6rem; font-weight: 700; padding: 3px 8px;
  border-radius: 8px; flex-shrink: 0;
}
.sm-status-connected { background: rgba(45,155,78,.25); color: #4ade80; }
.sm-status-disconnected { background: rgba(255,255,255,.1); color: rgba(255,255,255,.4); }

.sm-add-row { margin-top: 12px; text-align: center; }
.sm-add-btn {
  background: rgba(255,255,255,.1); border: 1.5px dashed rgba(255,255,255,.25);
  border-radius: 12px; padding: 10px 20px; color: rgba(255,255,255,.7);
  font-size: .78rem; font-weight: 700; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s;
}
.sm-add-btn:active { background: rgba(255,255,255,.18); }

.sm-empty-hint {
  text-align: center; padding: 16px 10px; color: rgba(255,255,255,.4);
  font-size: .75rem; line-height: 1.5;
}

/* ── AI Auto-Post ── */
.sm-autopost-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); border: 1.5px solid var(--border);
  padding: 16px; margin-bottom: 12px;
}
.sm-autopost-head {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px;
}
.sm-autopost-icon {
  width: 40px; height: 40px; border-radius: 12px;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 2px 8px rgba(139,92,246,.3);
}
.sm-autopost-title { font-weight: 800; font-size: .88rem; }
.sm-autopost-sub { font-size: .7rem; color: var(--text-light); margin-top: 1px; }
.sm-autopost-badge {
  font-size: .58rem; font-weight: 800; padding: 3px 8px;
  border-radius: 8px; background: #f3e8ff; color: #8b5cf6;
  margin-left: auto;
}
.sm-autopost-body { }

.sm-platform-chips {
  display: flex; gap: 6px; flex-wrap: wrap;
}
.sm-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 12px; border-radius: 10px; font-size: .72rem; font-weight: 700;
  background: #f0f2f5; color: var(--text-light); cursor: pointer;
  border: 1.5px solid transparent; transition: all .15s;
}
.sm-chip.active { background: #e8f5e9; color: #2d9b4e; border-color: #2d9b4e; }
.sm-chip:active { transform: scale(.95); }

.sm-autopost-btn {
  width: 100%; padding: 13px; border: none; border-radius: 12px;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
  color: #fff; font-weight: 800; font-size: .85rem;
  cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px;
  box-shadow: 0 3px 12px rgba(139,92,246,.3);
  transition: transform .1s;
}
.sm-autopost-btn:active { transform: scale(.97); }

/* ── Quick Marketing Actions ── */
.sm-quick-actions {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  margin-bottom: 14px;
}
.sm-qa-btn {
  background: var(--card); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 12px 6px; text-align: center;
  cursor: pointer; transition: transform .1s;
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  font-size: .66rem; font-weight: 700; color: var(--text);
}
.sm-qa-btn:active { transform: scale(.95); }
.sm-qa-icon {
  width: 38px; height: 38px; border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
}

/* Auto-post result card */
.sm-post-result {
  background: #f8f9fa; border-radius: 12px; padding: 14px;
  border: 1.5px solid var(--border);
}
.sm-post-result-head {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
  font-weight: 700; font-size: .82rem; color: var(--green);
}
.sm-post-text {
  font-size: .82rem; line-height: 1.6; white-space: pre-wrap;
  color: var(--text);
}
.sm-post-actions {
  display: flex; gap: 6px; margin-top: 10px;
}
.sm-post-action-btn {
  flex: 1; padding: 9px; border: none; border-radius: 10px;
  font-weight: 700; font-size: .72rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: transform .1s;
}
.sm-post-action-btn:active { transform: scale(.95); }

.calendar-day {
  display: flex;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

.calendar-day:last-child { border-bottom: none; }

.calendar-date {
  width: 44px;
  text-align: center;
  flex-shrink: 0;
}

.calendar-date .day-num {
  font-size: 1.3rem;
  font-weight: 800;
  line-height: 1;
}

.calendar-date .day-name {
  font-size: .65rem;
  color: var(--text-light);
  text-transform: uppercase;
}

.calendar-content {
  flex: 1;
  min-width: 0;
}

.calendar-post {
  padding: 8px 10px;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 600;
  margin-bottom: 4px;
}

.calendar-post:last-child { margin-bottom: 0; }

.hashtag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.hashtag {
  display: inline-block;
  padding: 4px 10px;
  background: #e8f4fd;
  color: var(--blue);
  border-radius: 16px;
  font-size: .72rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s;
}

.hashtag:active {
  background: #d0e8f9;
}

/* ===== Route Map Styles ===== */
.route-order-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}

.route-order-item:last-child { border-bottom: none; }

.route-order-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-weight: 800;
  font-size: .8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.route-order-info { flex: 1; min-width: 0; }

.route-order-title {
  font-weight: 600;
  font-size: .85rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.route-order-desc {
  font-size: .72rem;
  color: var(--text-light);
}

.route-order-nav {
  font-size: .72rem;
  color: var(--blue);
  font-weight: 600;
  flex-shrink: 0;
}

/* ===== Training Icons (SVG based) ===== */
.training-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.training-icon svg {
  width: 24px;
  height: 24px;
}

/* ===== Skool-style Course Detail ===== */
.course-lesson {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background .15s;
}

.course-lesson:last-child { border-bottom: none; }

.course-lesson:active { background: #f8f9fa; }

.lesson-check {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: .7rem;
  transition: all .2s;
}

.lesson-check.done {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.lesson-info { flex: 1; min-width: 0; }

.lesson-title {
  font-weight: 600;
  font-size: .85rem;
}

.lesson-title.completed {
  text-decoration: line-through;
  opacity: .6;
}

.lesson-duration {
  font-size: .7rem;
  color: var(--text-light);
  margin-top: 2px;
}

.lesson-content {
  display: none;
  padding: 12px 0 12px 36px;
  font-size: .82rem;
  line-height: 1.6;
  color: var(--text-light);
  border-bottom: 1px solid var(--border);
}

.lesson-content.show { display: block; }

.lesson-content .video-wrapper {
  margin-bottom: 12px;
  border-radius: 10px;
  overflow: hidden;
}

/* ===== AI Spinner inside button ===== */
.btn.loading {
  pointer-events: none;
  opacity: .7;
}

.btn.loading::after {
  content: '';
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255,255,255,.4);
  border-top-color: #fff;
  border-radius: 50%;
  display: inline-block;
  margin-left: 6px;
  animation: spin .6s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ===== Install App Modal ===== */
.install-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  font-size: .82rem;
  line-height: 1.5;
}

.install-step:not(:last-of-type) {
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.step-num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: .75rem;
  flex-shrink: 0;
}

.install-instructions .card {
  margin-top: 12px;
}

.tab-row {
  display: flex;
  gap: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 1px solid var(--border);
  margin-bottom: 4px;
}

.tab-row .tab {
  flex: 1;
  padding: 10px 4px;
  text-align: center;
  font-size: .75rem;
  font-weight: 600;
  cursor: pointer;
  background: var(--card);
  transition: all .2s;
  border: none;
  border-right: 1px solid var(--border);
}

.tab-row .tab:last-child { border-right: none; }

.tab-row .tab.active {
  background: var(--primary);
  color: #fff;
}

/* ===== Mode Selector ===== */
.mode-selector {
  display: flex;
  gap: 8px;
}

.mode-option {
  flex: 1;
  padding: 14px 10px;
  border-radius: var(--radius-sm);
  border: 2px solid var(--border);
  text-align: center;
  cursor: pointer;
  transition: all .2s;
}

.mode-option:active { transform: scale(.97); }

.mode-option.active {
  border-color: var(--accent);
  background: #fde8ea;
}

/* ===== Mode Visibility ===== */
body.mode-beginner .mode-expert-only { display: none !important; }
body.mode-expert .mode-beginner-only { display: none !important; }

/* ===== Button Purple ===== */
.btn-purple {
  background: var(--purple);
  color: #fff;
}

/* ===== Result Card (nozzle / chemical) ===== */
.result-card {
  background: #f0fdf4;
  border: 1px solid #c8e6c9;
  border-radius: var(--radius-sm);
  padding: 16px;
}

.result-card.warning {
  background: #fff3e0;
  border-color: #ffe0b2;
}

/* ===== Photo Grid ===== */
.photo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 8px;
}

.photo-thumb {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 8px;
  object-fit: cover;
  cursor: pointer;
  border: 1px solid var(--border);
}

.photo-add-btn {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 8px;
  border: 2px dashed var(--border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: .7rem;
  color: var(--text-light);
  background: #f8f9fa;
  transition: border-color .2s;
}

.photo-add-btn:active { border-color: var(--accent); }

/* ===== Signature Canvas ===== */
#signatureCanvas {
  width: 100%;
  height: 180px;
  border: 2px solid var(--border);
  border-radius: var(--radius-sm);
  background: #fff;
  touch-action: none;
  cursor: crosshair;
}

/* ===== Calendar View (Flow) ===== */
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.cal-nav-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--card);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}

.cal-nav-btn:active { background: #f3f4f6; }

.flow-cal-day {
  padding: 10px;
  border-radius: var(--radius-sm);
  margin-bottom: 6px;
  background: var(--card);
  border: 1px solid var(--border);
}

.flow-cal-day.today {
  border-color: var(--accent);
  background: #fef2f2;
}

.cal-day-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}

.cal-day-name {
  font-weight: 700;
  font-size: .85rem;
}

.cal-day-date {
  font-size: .72rem;
  color: var(--text-light);
}

.cal-order-block {
  padding: 8px 10px;
  border-radius: 8px;
  background: #f3f4f6;
  margin-bottom: 4px;
  font-size: .78rem;
  border-left: 3px solid var(--orange);
  cursor: pointer;
}

.cal-order-block:active { opacity: .8; }

.cal-order-block.active {
  border-left-color: var(--accent);
  background: #fde8ea;
}

.cal-order-block.done {
  border-left-color: var(--green);
  background: var(--green-light);
  opacity: .7;
}

.cal-empty {
  font-size: .75rem;
  color: var(--text-light);
  font-style: italic;
}

/* ===== Monthly Calendar Grid ===== */
.cal-month-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 10px;
}

.cal-month-head {
  text-align: center;
  font-size: .68rem;
  font-weight: 700;
  color: var(--text-light);
  padding: 4px 0;
  background: var(--card);
  border-radius: 4px;
}

.cal-month-cell {
  min-height: 58px;
  background: var(--card);
  border-radius: 8px;
  padding: 4px;
  cursor: pointer;
  border: 1px solid var(--border);
  transition: background .15s;
  overflow: hidden;
}

.cal-month-cell:active { background: #f5f5f5; }

.cal-month-cell.cal-today {
  border-color: var(--accent);
  background: #fff5f5;
}

.cal-month-cell.cal-dim {
  opacity: .35;
}

.cal-month-num {
  font-size: .72rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 2px;
}

.cal-today .cal-month-num {
  color: var(--accent);
}

.cal-month-event {
  font-size: .58rem;
  font-weight: 700;
  border-radius: 3px;
  padding: 1px 3px;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== Shop Card (polished) ===== */
.shop-card {
  background: var(--card);
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 14px;
  margin-bottom: 10px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  transition: box-shadow .2s, transform .15s;
}
.shop-card:active {
  transform: scale(.985);
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

.shop-card-icon {
  font-size: 1.8rem;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #f8fafc, #eef2f7);
  border-radius: 14px;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.shop-card-icon img {
  width: 56px; height: 56px;
  object-fit: contain;
  border-radius: 12px;
  background: #f0f4f8;
}

/* Shop feature card */
.shop-feature-card {
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,.15);
}

/* Shop promo banner polish */
#page-shop .tabs .tab {
  font-size: .78rem;
  padding: 8px 14px;
  border-radius: 10px;
}

/* Shop cart panel */
#shopCartPanel {
  border-radius: 16px !important;
  border: 1px solid var(--border);
}

/* ===== Machine Card ===== */
.machine-item {
  padding: 12px;
  background: var(--card);
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  margin-bottom: 8px;
}

.machine-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.machine-name {
  font-weight: 700;
  font-size: .88rem;
}

.machine-stat {
  display: flex;
  gap: 12px;
  font-size: .75rem;
  color: var(--text-light);
}

.machine-alert {
  padding: 6px 10px;
  border-radius: 6px;
  font-size: .72rem;
  font-weight: 600;
  margin-top: 6px;
}

.machine-alert.warning { background: #fff3e0; color: var(--orange); }
.machine-alert.danger { background: #fde8ea; color: var(--accent); }
.machine-alert.ok { background: var(--green-light); color: var(--green); }

/* ===== Exchange Post ===== */
.exchange-post {
  padding: 14px;
  background: var(--card);
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  margin-bottom: 10px;
  box-shadow: var(--shadow);
}

.exchange-post-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.exchange-type-tag {
  padding: 3px 10px;
  border-radius: 20px;
  font-size: .68rem;
  font-weight: 700;
}

.exchange-type-tag.need_help { background: #fff3e0; color: var(--orange); }
.exchange-type-tag.available { background: var(--green-light); color: var(--green); }
.exchange-type-tag.pass_order { background: #f3e8ff; color: var(--purple); }

.exchange-post-city {
  font-size: .72rem;
  color: var(--text-light);
}

.exchange-post-desc {
  font-size: .82rem;
  line-height: 1.5;
  margin-bottom: 8px;
}

.exchange-post-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .72rem;
  color: var(--text-light);
}

/* ===== GPS Button ===== */
.gps-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #e3f2fd;
  color: var(--blue);
  font-size: .75rem;
  font-weight: 600;
  cursor: pointer;
  margin-top: 6px;
}

.gps-btn:active { background: #bbdefb; }

/* ===== Price per m2 ===== */
.price-m2-display {
  font-size: .82rem;
  color: var(--green);
  font-weight: 700;
  margin-top: 4px;
}

/* ===== Photo Compare ===== */
.photo-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.photo-compare-side { text-align: center; }

.photo-compare-side img {
  width: 100%;
  border-radius: 8px;
  border: 1px solid var(--border);
}

.photo-compare-label {
  font-size: .72rem;
  font-weight: 700;
  margin-bottom: 4px;
}

/* ===== AI Quote Result ===== */
.ai-quote-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.ai-quote-item {
  background: #f8f9fa;
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.ai-quote-item .label {
  font-size: .7rem;
  color: var(--text-light);
  margin-bottom: 4px;
}
.ai-quote-item .value {
  font-size: 1rem;
  font-weight: 800;
}
.ai-quote-total {
  background: linear-gradient(135deg, var(--green), #1a8a3e);
  color: #fff;
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  margin-bottom: 12px;
}
.ai-quote-total .price {
  font-size: 1.5rem;
  font-weight: 900;
}
.ai-quote-method {
  background: #f0f7ff;
  border-radius: 10px;
  padding: 12px;
  font-size: .82rem;
  line-height: 1.5;
  border-left: 4px solid var(--blue);
}

/* ── Doradca DiBO — Dashboard Card ── */
.dash-advisor-card {
  display: flex; align-items: center; gap: 12px;
  background: #1a2332;
  border-radius: var(--radius); padding: 14px 16px;
  margin-bottom: 10px; cursor: pointer; position: relative; overflow: hidden;
  box-shadow: 0 4px 16px rgba(26,35,50,.25);
  transition: transform .15s;
}
.dash-advisor-card:active { transform: scale(.98); }
.dash-advisor-card::before {
  content: ''; position: absolute; top: -20px; right: -20px;
  width: 80px; height: 80px; border-radius: 50%;
  background: rgba(230,57,70,.15);
}
.dash-adv-left { display: flex; align-items: center; gap: 12px; flex: 1; }
.dash-adv-logo {
  width: 48px; height: 48px; border-radius: 14px;
  background: linear-gradient(135deg, #e63946, #b71c1c);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; padding: 5px;
  box-shadow: 0 3px 10px rgba(230,57,70,.35);
}
.dash-adv-title { font-weight: 800; font-size: .95rem; color: #fff; }
.dash-adv-sub { font-size: .68rem; color: rgba(255,255,255,.5); margin-top: 2px; }
.dash-adv-arrow { color: rgba(255,255,255,.4); flex-shrink: 0; }
.dash-adv-online {
  position: absolute; top: 12px; right: 12px;
  width: 9px; height: 9px; border-radius: 50%;
  background: #4caf50; border: 2px solid #1a2332;
  animation: fabPulse 2s ease-in-out infinite;
}
.dibo-advisor-n8n-btn {
  background: rgba(255,255,255,.12); border: none; border-radius: 8px;
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.7); cursor: pointer; flex-shrink: 0;
}
/* ===== Follow-up List ===== */
/* ── Smart Follow-up Center (Dashboard) ── */
.fu-center {
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  margin-bottom: 12px;
  overflow: hidden;
  border: 1.5px solid #ffe0b2;
}
.fu-center-head {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px 12px;
  background: #1a2332;
  color: #fff;
}
.fu-center-icon {
  width: 46px; height: 46px; border-radius: 14px;
  background: linear-gradient(135deg, #f77f00, #e63946);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 3px 12px rgba(247,127,0,.35);
}
.fu-center-info { flex: 1; }
.fu-center-title { font-weight: 800; font-size: .95rem; letter-spacing: -.01em; }
.fu-center-sub { font-size: .7rem; color: rgba(255,255,255,.55); margin-top: 1px; }
.fu-center-badge {
  min-width: 32px; height: 32px; border-radius: 10px;
  background: #e63946; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: .95rem;
  box-shadow: 0 2px 8px rgba(230,57,70,.35);
  flex-shrink: 0;
}

.fu-urgency-bar {
  display: flex; gap: 6px; padding: 10px 16px;
  background: #fef9f0; border-bottom: 1.5px solid #fff3e0;
}
.fu-urg-item {
  flex: 1; text-align: center; font-size: .65rem; font-weight: 800;
  padding: 6px 4px; border-radius: 8px;
  letter-spacing: .02em;
}
.fu-urg-critical { background: #fde8ea; color: #e63946; }
.fu-urg-warm { background: #fff3e0; color: #f77f00; }
.fu-urg-soon { background: #e3f2fd; color: #2196f3; }
.fu-urg-num { display: block; font-size: 1.1rem; font-weight: 900; line-height: 1.2; }

.fu-card {
  padding: 12px 16px; border-bottom: 1px solid var(--border);
  transition: background .1s;
}
.fu-card:last-child { border-bottom: none; }
.fu-card:active { background: #f8f9fa; }
.fu-card-row { display: flex; align-items: center; gap: 10px; }
.fu-card-avatar {
  width: 42px; height: 42px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .82rem; flex-shrink: 0;
}
.fu-card-info { flex: 1; min-width: 0; }
.fu-card-name { font-weight: 700; font-size: .85rem; }
.fu-card-meta { font-size: .68rem; color: var(--text-light); margin-top: 1px; }
.fu-card-right { text-align: right; flex-shrink: 0; }
.fu-card-days { font-weight: 900; font-size: 1.05rem; line-height: 1; }
.fu-card-label {
  font-size: .58rem; font-weight: 800; padding: 2px 8px;
  border-radius: 8px; margin-top: 3px; display: inline-block;
}
.fu-card-actions {
  display: flex; gap: 5px; margin-top: 8px;
}
.fu-action-btn {
  flex: 1; padding: 8px 6px; border: none; border-radius: 10px;
  font-weight: 700; font-size: .7rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 4px;
  transition: transform .1s; box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.fu-action-btn:active { transform: scale(.95); }
.fu-action-btn svg { flex-shrink: 0; }

.fu-center-footer {
  padding: 10px 16px 14px; text-align: center;
  background: #fafafa; border-top: 1px solid var(--border);
}
.fu-see-all-btn {
  background: none; border: 1.5px solid var(--border); border-radius: 10px;
  padding: 9px 18px; font-size: .75rem; font-weight: 700;
  color: var(--text); cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s;
}
.fu-see-all-btn:active { background: #f0f2f5; transform: scale(.97); }

.fu-empty {
  text-align: center; padding: 24px 16px;
}
.fu-empty-icon { font-size: 2.2rem; margin-bottom: 6px; }
.fu-empty-title { font-weight: 700; font-size: .85rem; color: #27ae60; }
.fu-empty-desc { font-size: .7rem; color: var(--text-light); margin-top: 3px; line-height: 1.4; }

@keyframes fuPulse {
  0%, 100% { box-shadow: 0 3px 12px rgba(247,127,0,.35); }
  50% { box-shadow: 0 3px 20px rgba(230,57,70,.5); }
}
.fu-center-badge[data-urgent="true"] {
  animation: fuPulse 2s ease-in-out infinite;
}

.followup-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.followup-item:last-child { border-bottom: none; }
.followup-info { flex: 1; min-width: 0; }
.followup-name { font-weight: 700; font-size: .85rem; }
.followup-type { font-size: .72rem; color: var(--text-light); }
.followup-actions { display: flex; gap: 6px; flex-shrink: 0; }

/* ===== Smart Scheduling ===== */
.smart-alert {
  background: linear-gradient(135deg, #fff8e1, #fff);
  border: 1.5px solid var(--orange);
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 10px;
}
.smart-alert-title {
  font-weight: 800;
  font-size: .88rem;
  color: var(--orange);
  margin-bottom: 4px;
}
.smart-alert-desc {
  font-size: .78rem;
  color: var(--text-light);
  line-height: 1.4;
}
.smart-client-list {
  max-height: 300px;
  overflow-y: auto;
}
.smart-client {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.smart-client:last-child { border-bottom: none; }

/* ===== Ambassador Markers ===== */
.ambassador-marker-pulse {
  width: 14px;
  height: 14px;
  background: var(--green);
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 0 0 0 rgba(45, 155, 78, .5);
  animation: ambassadorPulse 2s infinite;
}
@keyframes ambassadorPulse {
  0% { box-shadow: 0 0 0 0 rgba(45, 155, 78, .5); }
  70% { box-shadow: 0 0 0 10px rgba(45, 155, 78, 0); }
  100% { box-shadow: 0 0 0 0 rgba(45, 155, 78, 0); }
}
.my-location-marker {
  width: 18px;
  height: 18px;
  background: var(--blue);
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 0 0 0 rgba(33, 150, 243, .5);
  animation: myLocationPulse 2s infinite;
}
@keyframes myLocationPulse {
  0% { box-shadow: 0 0 0 0 rgba(33, 150, 243, .5); }
  70% { box-shadow: 0 0 0 12px rgba(33, 150, 243, 0); }
  100% { box-shadow: 0 0 0 0 rgba(33, 150, 243, 0); }
}
.job-marker {
  width: 12px;
  height: 12px;
  background: var(--orange);
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.3);
}
.ambassador-profile-card {
  text-align: center;
  padding: 10px 0;
}
.ambassador-profile-card .avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 900;
  margin: 0 auto 12px;
}
.ambassador-profile-card .name {
  font-size: 1.1rem;
  font-weight: 800;
}
.ambassador-profile-card .city {
  font-size: .82rem;
  color: var(--text-light);
  margin-bottom: 12px;
}
.ambassador-spec-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin-bottom: 16px;
}
.ambassador-spec-tag {
  font-size: .72rem;
  background: #e8f5e9;
  color: var(--green);
  padding: 4px 10px;
  border-radius: 20px;
  font-weight: 600;
}

/* ===== DiboLead — Rynek & Osiedla chips ===== */
.realty-chip {
  background: #f0f4f8;
  border: 1.5px solid #dde3ea;
  border-radius: 20px;
  font-size: .72rem;
  font-weight: 600;
  color: #1a2332;
  padding: 4px 12px;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.realty-chip:hover {
  background: #e3f2fd;
  border-color: var(--blue);
  color: var(--blue);
}
.realty-card-img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  display: block;
}
.realty-signal-badge {
  display: inline-block;
  background: #fff3e0;
  color: #e65100;
  font-size: .6rem;
  padding: 2px 7px;
  border-radius: 5px;
  font-weight: 700;
  margin: 2px;
}
.building-cluster-card {
  border-left: 4px solid var(--accent);
  margin-bottom: 12px;
}
.building-cluster-year {
  display: inline-block;
  font-size: .62rem;
  background: #e3f2fd;
  color: #1976d2;
  padding: 2px 7px;
  border-radius: 5px;
  margin: 2px;
  font-weight: 600;
}

/* ===== DiBO Reel Studio — Template Cards + Brief Sections ===== */
.reel-tpl-card {
  border: 2px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 6px;
  text-align: center;
  cursor: pointer;
  background: #fff;
  transition: all .18s;
  user-select: none;
}
.reel-tpl-card:hover {
  border-color: #f77f00;
  background: #fffaf5;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(247,127,0,.18);
}
.reel-tpl-card.active {
  border-color: #f77f00;
  background: linear-gradient(135deg, #fff3e0, #fff8f0);
  box-shadow: 0 0 0 3px rgba(247,127,0,.2);
}

/* Brief output sections */
.reel-brief-section {
  background: #fff;
  border-left: 4px solid #f77f00;
  border-radius: 0 10px 10px 0;
  padding: 10px 12px;
  margin-bottom: 10px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
}
.reel-brief-label {
  font-size: .65rem;
  font-weight: 800;
  color: #f77f00;
  letter-spacing: .6px;
  margin-bottom: 7px;
  text-transform: uppercase;
}

/* Scene timeline row */
.reel-scene-row {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 7px 0;
  border-bottom: 1px dashed #f0e8dc;
  font-size: .78rem;
}
.reel-scene-row:last-child { border-bottom: none; }
.reel-scene-time {
  background: #1a2332;
  color: #ffd54f;
  font-size: .6rem;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 2px;
}
.reel-overlay-chip {
  background: #1a2332;
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 20px;
  display: inline-block;
  margin: 2px 0;
}
.reel-cta-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 5px 0;
  font-size: .8rem;
  border-bottom: 1px dashed #fde8ea;
}
.reel-cta-row:last-child { border-bottom: none; }


/* ===== iOS / Android Optimizations ===== */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Remove blue flash on tap (iOS) */
a, button, [onclick] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* Prevent iOS zoom on input focus */
input, select, textarea {
  font-size: 16px !important;
}
.form-input, .form-select, .form-textarea {
  font-size: 16px !important;
}

/* Smooth scrolling everywhere */
* {
  -webkit-overflow-scrolling: touch;
}

/* Safe area for iPhone notch/home indicator */
.bottom-nav {
  padding-bottom: max(var(--safe-bottom), env(safe-area-inset-bottom, 0px));
}

/* Fix iOS Safari 100vh bug */
.page, .modal-overlay {
  min-height: -webkit-fill-available;
}

/* Better touch targets (min 44px per Apple HIG) */
.btn, .nav-item, .tab, .quick-action, .list-item {
  min-height: 44px;
}

/* Prevent text selection on UI elements */
.btn, .nav-item, .tab, .quick-action, .section-title {
  -webkit-user-select: none;
  user-select: none;
}

/* Smooth momentum scrolling for page content */
.page {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

/* Fix modal sheet animation on iOS */
.modal-sheet {
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Fix position:sticky on iOS Safari */
.app-header {
  position: -webkit-sticky;
  position: sticky;
}

/* Quick Order service buttons */
.qo-service-btn {
  transition: all .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.qo-service-btn.active {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}

/* AI Profit card dark stat numbers */
#aiProfitStatOrders, #aiProfitStatAvg, #aiProfitStatMonth {
  font-variant-numeric: tabular-nums;
}

/* Surface scanner result card */
.surface-result-card {
  background: #f0f9f0;
  border: 1.5px solid #c8e6c9;
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 10px;
}
.surface-param-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
  font-size: .8rem;
}
.surface-param-row:last-child { border-bottom: none; }
.surface-param-label { color: #666; font-weight: 500; }
.surface-param-value { font-weight: 700; color: #1a2332; }

/* Technical passport styles */
.passport-card {
  background: linear-gradient(160deg,#0d1b2a,#1a2d42);
  color: #fff;
  border-radius: 16px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  margin-bottom: 14px;
}
.passport-card::before {
  content: '';
  position: absolute;
  top: -30px;
  right: -30px;
  width: 120px;
  height: 120px;
  background: rgba(255,255,255,.04);
  border-radius: 50%;
}
.passport-field {
  display: flex;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  font-size: .8rem;
}
.passport-field:last-child { border-bottom: none; }
.passport-field-label { opacity: .6; }
.passport-field-value { font-weight: 700; color: #69f0ae; }

/* Referral link box */
.referral-link-box {
  background: linear-gradient(135deg,#e8f5e9,#f1f8e9);
  border: 2px solid #4caf50;
  border-radius: 12px;
  padding: 14px;
  text-align: center;
  margin-bottom: 14px;
}

/* Shop card — sprzet image */
.shop-card-icon { min-width: 60px; display: flex; align-items: center; justify-content: center; }

/* ===== CRM — Smart Dashboard ===== */
.crm-header {
  margin-bottom: 14px;
}
.crm-header-top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.crm-header-title {
  font-size: 1.35rem; font-weight: 900; color: var(--text); line-height: 1.1;
}
.crm-header-sub {
  font-size: .72rem; color: #999; margin-top: 2px;
}
.crm-add-btn {
  display: flex; align-items: center; gap: 6px;
  background: #95c11f; color: #ffffff;
  border: none; border-radius: var(--r-sm); padding: var(--p-btn);
  font-weight: 600; font-size: .82rem; cursor: pointer;
  box-shadow: 0 2px 6px rgba(149,193,31,.3);
  transition: all .15s ease;
  font-family: inherit;
  letter-spacing: -.005em;
}
.crm-add-btn:hover { box-shadow: 0 4px 10px rgba(149,193,31,.4); transform: translateY(-1px); }
.crm-add-btn:active { transform: scale(.97); }
.crm-search-wrap {
  position: relative;
}
.crm-search-icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  stroke: #aaa; pointer-events: none;
}
.crm-search {
  width: 100%; padding: 12px 14px 12px 40px;
  border: 1.5px solid #e8eaed; border-radius: 14px;
  font-size: .88rem; background: #f8f9fb; color: var(--text);
  outline: none; transition: border-color .2s;
}
.crm-search:focus { border-color: var(--blue); background: #fff; }

/* Pipeline visual grid */
.crm-pipeline {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 6px; margin-bottom: 14px;
}
.crm-pipe-stage {
  background: #f8f9fb; border-radius: 12px; padding: 10px 6px 8px;
  text-align: center; cursor: pointer; position: relative;
  border: 1.5px solid transparent; transition: all .15s;
  overflow: hidden;
}
.crm-pipe-stage.active {
  background: #fff; border-color: #1a2332;
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.crm-pipe-num {
  font-size: 1.3rem; font-weight: 900; line-height: 1;
}
.crm-pipe-label {
  font-size: .55rem; font-weight: 700; color: #999;
  margin-top: 3px; text-transform: uppercase; letter-spacing: .04em;
}
.crm-pipe-bar-fill {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px; opacity: 0; transition: opacity .2s;
}
.crm-pipe-stage.active .crm-pipe-bar-fill { opacity: 1; }

/* Urgency alerts */
.crm-alert {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 12px; margin-bottom: 8px;
  cursor: pointer; transition: transform .1s;
}
.crm-alert:active { transform: scale(.98); }
.crm-alert-icon {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; flex-shrink: 0;
}
.crm-alert-text { flex: 1; }
.crm-alert-title { font-weight: 700; font-size: .78rem; }
.crm-alert-desc { font-size: .65rem; opacity: .7; margin-top: 1px; }

/* Feed header */
.crm-feed-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px; padding: 0 2px;
}
.crm-feed-header #crmFeedTitle {
  font-weight: 800; font-size: .82rem; color: var(--text);
}
.crm-rev-tag {
  font-size: .62rem; background: #e8f5e9; color: #2d9b4e;
  padding: 3px 10px; border-radius: 8px; font-weight: 700;
}

/* Smart CRM cards */
.crm-card {
  background: #fff; border: 1.5px solid #eef0f3; border-radius: 16px;
  padding: 14px; margin-bottom: 8px; cursor: pointer;
  transition: transform .1s, box-shadow .15s;
}
.crm-card:active {
  transform: scale(.985); box-shadow: 0 2px 10px rgba(0,0,0,.06);
}
.crm-next-action {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: .62rem; font-weight: 800; padding: 3px 10px;
  border-radius: 10px; margin-top: 4px;
}

/* AI CRM Bar — fixed above bottom nav */
.crm-ai-bar {
  position: sticky; bottom: 0; z-index: 50;
  margin: 12px -16px -16px; padding: 0 16px 16px;
  background: linear-gradient(to top, #fff 60%, transparent);
}
.crm-ai-bar-inner {
  display: flex; align-items: center; gap: 10px;
  background: linear-gradient(145deg, #0f1923, #1a2c40);
  border-radius: 16px; padding: 12px 14px;
  box-shadow: 0 4px 20px rgba(0,0,0,.2);
  border: 1px solid rgba(45,155,78,.15);
}
.crm-ai-icon {
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, #2d9b4e, #1b7a35);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.crm-ai-icon svg { stroke: #fff; }
.crm-ai-content { flex: 1; min-width: 0; }
.crm-ai-text {
  font-size: .73rem; color: rgba(255,255,255,.8); line-height: 1.45;
}
.crm-ai-refresh {
  width: 34px; height: 34px; border-radius: 10px;
  background: rgba(255,255,255,.08); border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; transition: transform .15s;
}
.crm-ai-refresh svg { stroke: rgba(255,255,255,.5); }
.crm-ai-refresh:active { transform: scale(.9); }

/* Pipeline filter compat */
.crm-pipeline-bar { display:none; }
.crm-pipe-btn { display:none; }
.crm-pipe-count { display:none; }
/* Pipeline dots in detail modal */
.crm-pipeline-dots { display:flex;align-items:flex-start;justify-content:space-between;padding:14px 0;margin-bottom:12px;position:relative; }
.crm-pipeline-dots::before { content:'';position:absolute;top:18px;left:10%;right:10%;height:2px;background:#e0e0e0;z-index:0; }
.crm-pipe-step { display:flex;flex-direction:column;align-items:center;gap:5px;flex:1;z-index:1; }
.crm-pipe-dot { width:22px;height:22px;border-radius:50%;background:#e0e0e0;border:2px solid #e0e0e0; }
.crm-pipe-step.done .crm-pipe-dot { background:#2d9b4e;border-color:#2d9b4e; }
.crm-pipe-step.current .crm-pipe-dot { background:#1a2332;border-color:#1a2332;box-shadow:0 0 0 3px rgba(26,35,50,.2); }
.crm-pipe-step-label { font-size:.58rem;color:#aaa;font-weight:600;text-align:center;line-height:1.2; }
.crm-pipe-step.current .crm-pipe-step-label,.crm-pipe-step.done .crm-pipe-step-label { font-weight:800; }
.crm-pipe-step.current .crm-pipe-step-label { color:#1a2332; }
.crm-pipe-step.done .crm-pipe-step-label { color:#2d9b4e; }

/* Order history in profile */
.oh-filter {
  background: #f0f2f5;
  border: 1.5px solid transparent;
  border-radius: 20px;
  padding: 5px 14px;
  font-size: .72rem;
  font-weight: 700;
  color: #555;
  cursor: pointer;
}
.oh-filter.active {
  background: #1a2332;
  color: #fff;
  border-color: #1a2332;
}
.oh-card {
  background: #fff;
  border: 1.5px solid #e8eaed;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 10px;
  position: relative;
}
.oh-card:hover { border-color: #bbb; }
.oh-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.oh-badge {
  font-size: .62rem;
  font-weight: 800;
  padding: 3px 9px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.oh-badge-done   { background: #e8f5e9; color: #2d9b4e; }
.oh-badge-active { background: #fff3e0; color: #f77f00; }
.oh-badge-new    { background: #e3f2fd; color: #1976d2; }
.oh-badge-other  { background: #f0f2f5; color: #555; }
.oh-price {
  font-size: 1.05rem;
  font-weight: 900;
  color: #1a2332;
}
.oh-meta {
  font-size: .72rem;
  color: #888;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.oh-empty {
  text-align: center;
  padding: 32px 16px;
  color: #aaa;
  font-size: .85rem;
}

/* ===== Subscription Cards ===== */
.sub-plan-card {
  border: 1.5px solid var(--border);
  transition: border-color .2s;
}
.sub-plan-popular {
  border-color: var(--green);
  background: linear-gradient(180deg,#f8fffe,#fff);
}
.sub-btn {
  font-size: .85rem;
  padding: 12px;
  border-radius: 10px;
  font-weight: 700;
}

/* ===== Order Tags ===== */
.order-card { transition: box-shadow .15s; }
.order-tag {
  font-size: .7rem;
  background: #f3f4f6;
  color: var(--text-light);
  border-radius: 6px;
  padding: 3px 8px;
  border: none;
  cursor: default;
}
.order-tag-price {
  background: #e8f5e9;
  color: var(--green);
  font-weight: 700;
}
.order-tag-btn {
  background: #e8f0fe;
  color: #3b5bdb;
  cursor: pointer;
}

/* ===== Section Icon SVG alignment ===== */
.section-title .icon svg { display: block; }

/* ═══════════════════════════════════════════
   DASHBOARD — Apple-inspired design
   ═══════════════════════════════════════════ */

/* Hero greeting */
.dash-hero {
  padding: 8px 0 22px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  position: relative;
}
.dash-hero::before {
  content: '';
  position: absolute;
  left: -16px;
  right: -16px;
  top: -8px;
  bottom: -8px;
  background: radial-gradient(ellipse at 20% 30%, rgba(149,193,31,.08) 0%, transparent 60%);
  pointer-events: none;
  z-index: -1;
}
.dash-date {
  font-size: .72rem;
  color: #6b7589;
  letter-spacing: .08em;
  margin-bottom: 5px;
  text-transform: uppercase;
  font-weight: 600;
}
.dash-name {
  font-size: 1.85rem;
  font-weight: 600;
  color: #1d2a3a;
  letter-spacing: -.035em;
  line-height: 1;
  position: relative;
  padding-left: 14px;
}
.dash-name::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  background: #95c11f;
  border-radius: 4px;
}
.dash-hero-badge {
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .12em;
  color: #fff;
  background: #95c11f;
  border-radius: 8px;
  padding: 6px 11px;
  text-transform: uppercase;
  margin-bottom: 2px;
  box-shadow: 0 3px 10px rgba(149,193,31,.35);
}

/* AI Income Optimizer Card */
.dash-income-ai-card {
  background: linear-gradient(145deg, #0f1923, #1a2c40);
  border-radius: 20px;
  padding: 18px;
  margin-bottom: 10px;
  color: #fff;
  box-shadow: 0 6px 24px rgba(0,0,0,.25);
  border: 1px solid rgba(45,155,78,.2);
}
.income-ai-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.income-ai-icon {
  width: 42px; height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, #2d9b4e, #1b7a35);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(45,155,78,.3);
}
.income-ai-icon svg { stroke: #fff; }
.income-ai-title {
  font-weight: 800; font-size: .95rem; line-height: 1.2;
}
.income-ai-sub {
  font-size: .68rem; opacity: .55; margin-top: 2px; line-height: 1.4;
}
.income-ai-preview {
  background: rgba(255,255,255,.04);
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 14px;
  min-height: 48px;
}
.income-ai-hint {
  font-size: .73rem; opacity: .45; line-height: 1.5; text-align: center;
}
.income-ai-btn {
  width: 100%;
  padding: 12px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(135deg, #2d9b4e, #1b7a35);
  color: #fff;
  font-weight: 700;
  font-size: .85rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  transition: transform .15s, box-shadow .15s;
  box-shadow: 0 4px 16px rgba(45,155,78,.3);
}
.income-ai-btn:active { transform: scale(.97); }
.income-ai-btn:disabled { opacity: .5; }
/* AI result tips */
.income-tip {
  background: rgba(255,255,255,.05);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 8px;
  border-left: 3px solid #2d9b4e;
}
.income-tip-title { font-weight: 700; font-size: .82rem; margin-bottom: 4px; }
.income-tip-desc { font-size: .72rem; opacity: .75; line-height: 1.5; }
.income-tip-meta {
  display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap;
}
.income-tip-tag {
  font-size: .6rem; padding: 3px 8px; border-radius: 6px;
  background: rgba(255,255,255,.08); font-weight: 600;
}
.dash-scan-btn {
  background: rgba(255,255,255,.13);
  color: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  padding: 7px 14px;
  font-size: .72rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: .01em;
  transition: background .15s;
  white-space: nowrap;
}
.dash-scan-btn:active { background: rgba(255,255,255,.25); }

/* 2×2 stats grid — iOS widget tiles */
/* ═══════════════════════════════════════════════════════════════
   DASHBOARD STAT TILES — premium DiBO widgety z depth
   ═══════════════════════════════════════════════════════════════ */
/* ── DASH STAT TILES — Glass premium effect ── */
.dash-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 20px;
}

/* ── PASEK WARTOŚCI — granat (ważne = brand), zieleń jako akcent ── */
.dash-value {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 20px;
}
.dv-tile {
  background: #1d2a3a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 1rem;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 2px 12px -3px rgba(15,23,42,.22);
  -webkit-tap-highlight-color: transparent;
}
.dv-tile[onclick] { cursor: pointer; transition: transform .15s, box-shadow .25s; }
.dv-tile[onclick]:active { transform: scale(.98); }
.dv-ico {
  width: 38px; height: 38px;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  background: rgba(149,193,31,.16);
  color: #95c11f;
}
.dv-ico svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; stroke-width: 1.9; }
.dv-body { min-width: 0; }
.dv-val {
  font-size: 1.15rem; font-weight: 800; color: #ffffff;
  letter-spacing: -.02em; line-height: 1.1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dv-lbl {
  font-size: .72rem; font-weight: 600; color: rgba(255,255,255,.55);
  margin-top: 3px; letter-spacing: .01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.dash-stat-tile {
  background: #ffffff;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 1rem;
  padding: 22px 16px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
  transition: box-shadow .25s, transform .15s, border-color .2s;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  overflow: hidden;
  min-height: 124px;
}
.dash-stat-tile::before { display: none !important; }
.dash-stat-tile::after { display: none !important; }
.dash-stat-tile > * { position: relative; z-index: 1; }
.dash-stat-tile:active { transform: scale(.985); }
.dash-stat-tile:hover {
  border-color: rgba(15,23,42,.12);
  box-shadow: 0 8px 20px -6px rgba(15,23,42,.08);
}

/* Ikona — outline tylko (Lucide/Heroicons outline style) */
.dst-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-bottom: 12px;
  background: transparent;
  color: hsl(240 3.8% 46.1%);
  box-shadow: none;
  border: 0;
}
.dst-icon svg {
  display: block;
  width: 22px !important;
  height: 22px !important;
  stroke-width: 1.5 !important;
  stroke: currentColor !important;
  fill: none !important;
}
/* Akcent zielony TYLKO dla "Umówione" (4ta karta) */
.dash-stat-tile:nth-child(4) .dst-icon { color: #95c11f; }

/* Cyfry — duże i smukłe (Light 300) */
.dst-val {
  font-size: 2.5rem;
  font-weight: 300;
  color: #1d2a3a;            /* granat zamiast czarnego */
  line-height: 1;
  letter-spacing: -.03em;
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
}
.dst-label {
  font-size: .65rem;
  color: hsl(240 3.8% 46.1%);
  letter-spacing: .12em;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 1.2;
}
.dash-stat-tile:nth-child(4) .dst-val { color: #5a7811; }

/* ═══ Pulpit: 4 kafle statystyk → JEDNA karta (inset grouped 2×2) ═══ */
.dash-stats-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-template-rows: repeat(2, 1fr) !important;
  gap: 0 !important;
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
}
.dash-stats-grid .dash-stat-tile {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
  padding: 22px 12px !important;
}
.dash-stats-grid .dash-stat-tile:active { transform: none !important; background: #f5f5f8 !important; }
.dash-stats-grid .dash-stat-tile:hover { box-shadow: none !important; }
/* hairline 0.5px: pion między kolumnami, poziom między wierszami */
.dash-stats-grid .dash-stat-tile:nth-child(odd) { border-right: 0.5px solid rgba(60,60,67,.12) !important; }
.dash-stats-grid .dash-stat-tile:nth-child(1),
.dash-stats-grid .dash-stat-tile:nth-child(2) { border-bottom: 0.5px solid rgba(60,60,67,.12) !important; }

/* Wrapper div w HTML — make it stack properly */
.dash-stat-tile > div:last-child {
  margin-top: auto;
}

/* Quick actions row — iOS app shortcuts */
/* ── DASH ACTIONS — shadcn-style buttons (NO pastel) ── */
.dash-actions-label {
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: hsl(240 3.8% 46.1%);
  padding-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.dash-actions-label::before {
  content: '';
  width: 3px;
  height: 12px;
  background: #95c11f;
  border-radius: 1px;
}
.dash-actions-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}
.dash-action {
  background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 0.875rem;
  padding: 22px 12px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  box-shadow:
    0 1px 3px rgba(15,23,42,.04),
    0 4px 12px -2px rgba(15,23,42,.03),
    inset 0 1px 0 rgba(255,255,255,.6);
  font-size: .78rem;
  color: #1d2a3a;
  font-weight: 600;
  transition: all .2s ease;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  overflow: hidden;
  letter-spacing: -.005em;
}
.dash-action::before {
  content: '';
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent);
  pointer-events: none;
}
.dash-action::after { display: none; }
.dash-action:hover {
  border-color: rgba(15,23,42,.12);
  box-shadow:
    0 4px 16px -2px rgba(15,23,42,.08),
    0 2px 6px rgba(15,23,42,.04),
    inset 0 1px 0 rgba(255,255,255,.6);
  transform: translateY(-1px);
}
.dash-action:active {
  transform: scale(.97);
}
.da-icon {
  width: 36px;
  height: 36px;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: hsl(240 3.8% 46.1%);
  box-shadow: none;
}
.da-icon svg {
  display: block;
  width: 22px !important;
  height: 22px !important;
  stroke-width: 1.5 !important;
  stroke: currentColor !important;
  fill: none !important;
}
.dash-action > div:last-child,
.dash-action > span:last-child {
  letter-spacing: .01em;
}

/* Section containers — grouped list style */
.dash-section {
  background: var(--card);
  border-radius: 16px;
  padding: 14px 14px 8px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.dash-section-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.dash-section-hdr > span {
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
}
.dash-section-hdr > button {
  font-size: .75rem;
  color: var(--text-light);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  font-weight: 500;
}

/* Override list-item margin inside dash-section */
.dash-section .list-item:last-child { border-bottom: none; }
.dash-section .review-card:last-child { border-bottom: none; margin-bottom: 0; }

/* ===== AUTOMATION PAGE ===== */
.auto-hero {
  background: linear-gradient(135deg, #0d1b2a 0%, #1a3a5c 100%);
  border-radius: var(--radius);
  padding: 18px 16px 14px;
  margin-bottom: 12px;
  color: #fff;
}
.auto-hero-top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.auto-hero-icon {
  width: 48px; height: 48px; border-radius: 14px;
  background: linear-gradient(135deg, #8b5cf6, #5b21b6);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 3px 12px rgba(139,92,246,.35);
}
.auto-hero-title { font-weight: 800; font-size: .95rem; }
.auto-hero-sub { font-size: .7rem; opacity: .55; margin-top: 2px; }
.auto-hero-stats { display: flex; align-items: center; }
.auto-stat { flex: 1; text-align: center; }
.auto-stat-val { font-size: 1.25rem; font-weight: 900; color: #69f0ae; }
.auto-stat-lbl { font-size: .58rem; opacity: .5; margin-top: 2px; }
.auto-stat-sep { width: 1px; height: 32px; background: rgba(255,255,255,.12); }

.auto-agent-card {
  position: relative; overflow: hidden;
  background: linear-gradient(145deg, #0d1b2a, #1a2e4a);
  border-radius: var(--radius);
  padding: 18px 16px;
  margin-bottom: 12px;
  border: 1.5px solid rgba(139,92,246,.35);
  box-shadow: 0 6px 24px rgba(139,92,246,.12);
}
.auto-agent-glow {
  position: absolute; top: -40px; right: -40px;
  width: 140px; height: 140px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,92,246,.25) 0%, transparent 70%);
  pointer-events: none;
}
.auto-agent-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.auto-agent-avatar {
  width: 50px; height: 50px; border-radius: 14px;
  background: linear-gradient(135deg, #8b5cf6, #5b21b6);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 3px 12px rgba(139,92,246,.4);
}
.auto-agent-info { flex: 1; }
.auto-agent-name { font-weight: 800; font-size: .95rem; color: #fff; }
.auto-agent-desc { font-size: .68rem; color: rgba(255,255,255,.5); margin-top: 2px; }
.auto-agent-lock {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  background: rgba(139,92,246,.2); border: 1px solid rgba(139,92,246,.4);
  border-radius: 10px; padding: 6px 10px;
  color: #b388ff; font-size: .6rem; font-weight: 800; letter-spacing: .05em;
}
.auto-agent-tasks { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.auto-agent-task {
  display: flex; align-items: center; gap: 10px;
  font-size: .75rem; color: rgba(255,255,255,.75);
}
.auto-agent-task-icon {
  width: 28px; height: 28px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.auto-task-badge {
  font-size: .55rem; font-weight: 800; padding: 2px 8px;
  border-radius: 8px; letter-spacing: .05em; white-space: nowrap;
}
.auto-task-done { background: rgba(105,240,174,.15); color: #69f0ae; }
.auto-task-soon { background: rgba(255,213,79,.12); color: #ffd54f; }
.auto-agent-cta {
  display: flex; align-items: center; gap: 12px;
  padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08);
}
.auto-agent-price { color: #fff; }
.auto-agent-price-from { font-size: .65rem; opacity: .5; }
.auto-agent-price-val { font-size: 1.4rem; font-weight: 900; margin: 0 3px; }
.auto-agent-price-per { font-size: .65rem; opacity: .5; }
.auto-agent-btn {
  flex: 1; background: linear-gradient(135deg, #8b5cf6, #5b21b6);
  color: #fff; border: none; border-radius: 12px;
  padding: 12px 16px; font-weight: 800; font-size: .82rem;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; box-shadow: 0 4px 14px rgba(139,92,246,.4);
  transition: transform .15s;
}
.auto-agent-btn:active { transform: scale(.97); }

.auto-section-head {
  display: flex; justify-content: space-between; align-items: center;
  margin: 16px 0 8px;
}
.auto-section-title { font-weight: 800; font-size: .88rem; color: var(--text); }
.auto-add-btn {
  background: var(--primary); color: #fff;
  border: none; border-radius: 10px;
  padding: 7px 14px; font-size: .72rem; font-weight: 700;
  display: flex; align-items: center; gap: 5px; cursor: pointer;
}
.auto-item {
  background: var(--card); border-radius: 14px;
  padding: 12px 14px; margin-bottom: 8px;
  display: flex; align-items: center; gap: 10px;
  box-shadow: var(--shadow);
}
.auto-item-active { border-left: 3px solid #2d9b4e; }
.auto-item-paused { border-left: 3px solid #f77f00; }
.auto-item-icon {
  width: 38px; height: 38px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.auto-item-info { flex: 1; min-width: 0; }
.auto-item-name { font-weight: 700; font-size: .84rem; }
.auto-item-meta { font-size: .67rem; color: var(--text-light); margin-top: 2px; }
.auto-item-right { text-align: right; flex-shrink: 0; }
.auto-item-badge { font-size: .6rem; font-weight: 700; padding: 2px 8px; border-radius: 8px; }
.auto-badge-on { background: #e8f5e9; color: #2d9b4e; }
.auto-badge-pause { background: #fff3e0; color: #f77f00; }
.auto-item-runs { font-size: .6rem; color: #aaa; margin-top: 3px; }
.auto-webhook {
  background: var(--card); border-radius: 14px;
  padding: 14px; margin-top: 8px; box-shadow: var(--shadow);
}
.auto-webhook-label {
  display: flex; align-items: center; gap: 6px;
  font-weight: 700; font-size: .8rem; margin-bottom: 8px;
}

/* ===== SUBSCRIPTION — API INTEGRATIONS ===== */
.api-section {
  background: var(--card); border-radius: var(--radius);
  padding: 0 0 6px; margin-bottom: 12px;
  box-shadow: var(--shadow); overflow: hidden;
}
.api-section-head {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px 14px;
  background: #1a2332;
  color: #fff;
}
.api-section-icon {
  width: 38px; height: 38px; border-radius: 12px;
  background: rgba(255,255,255,.12);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.api-section-title { font-weight: 800; font-size: .92rem; }
.api-section-sub { font-size: .68rem; opacity: .5; margin-top: 2px; }
.api-card {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px 0;
}
.api-card-left { display: flex; align-items: center; gap: 10px; flex: 1; }
.api-card-logo {
  width: 38px; height: 38px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.api-card-name { font-weight: 700; font-size: .84rem; }
.api-card-desc { font-size: .67rem; color: var(--text-light); margin-top: 2px; }
.api-card-status { display: flex; align-items: center; gap: 5px; font-size: .68rem; font-weight: 600; color: #aaa; white-space: nowrap; }
.api-dot { width: 7px; height: 7px; border-radius: 50%; }
.api-dot-off { background: #ccc; }
.api-dot-on { background: #2d9b4e; box-shadow: 0 0 6px rgba(45,155,78,.5); }
.api-key-row { padding: 10px 14px 4px; }
.api-key-input { margin-bottom: 0 !important; font-size: .78rem !important; }
.api-connect-btn {
  width: 100%; margin-top: 8px; background: var(--primary); color: #fff;
  border: none; border-radius: 10px; padding: 10px; font-weight: 700; font-size: .8rem; cursor: pointer;
  transition: background .15s;
}
.api-connect-btn:active { background: #0d1520; }
.api-toggle-btn {
  display: flex; align-items: center; gap: 5px;
  background: none; border: none;
  padding: 6px 14px 10px; font-size: .7rem; color: var(--blue); font-weight: 600;
  cursor: pointer;
}

/* ===== DORADCA DiBO — Floating AI Advisor ===== */
.dibo-advisor-fab {
  position: fixed; bottom: 84px; right: 16px; z-index: 900;
  width: 60px; height: 60px; border-radius: 18px;
  background: linear-gradient(135deg, #e63946, #b71c1c);
  border: none; cursor: pointer; color: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  box-shadow: 0 4px 18px rgba(230,57,70,.45);
  transition: transform .2s;
}
.dibo-advisor-fab:active { transform: scale(.93); }
.dibo-advisor-fab-label { font-size: .52rem; font-weight: 800; letter-spacing: .04em; }
.dibo-advisor-fab-pulse {
  position: absolute; top: -3px; right: -3px;
  width: 12px; height: 12px; border-radius: 50%;
  background: #4caf50; border: 2px solid #fff;
  animation: fabPulse 2s ease-in-out infinite;
}
@keyframes fabPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(76,175,80,.5); }
  50% { box-shadow: 0 0 0 6px rgba(76,175,80,0); }
}

.dibo-advisor-overlay {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,.45); backdrop-filter: blur(4px);
  display: flex; align-items: flex-end; justify-content: center;
}
.dibo-advisor-modal {
  width: 100%; max-width: 480px;
  background: #fff; border-radius: 24px 24px 0 0;
  max-height: 88vh; display: flex; flex-direction: column;
  overflow: hidden; animation: slideUpAdvisor .3s ease;
}
@keyframes slideUpAdvisor {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.dibo-advisor-header {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px 14px;
  background: #1a2332;
  flex-shrink: 0;
}
.dibo-advisor-avatar {
  width: 44px; height: 44px; border-radius: 14px;
  background: linear-gradient(135deg, #e63946, #b71c1c);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.dibo-advisor-hinfo { flex: 1; }
.dibo-advisor-hname { font-weight: 800; font-size: .95rem; color: #fff; }
.dibo-advisor-hsub { font-size: .68rem; color: rgba(255,255,255,.5); margin-top: 2px; }
.dibo-advisor-close {
  background: rgba(255,255,255,.12); border: none; border-radius: 10px;
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
  color: #fff; cursor: pointer;
}

.dibo-advisor-messages {
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
  background: #f8f9fb;
}
.dibo-advisor-msg { display: flex; }
.dibo-msg-bot { justify-content: flex-start; }
.dibo-msg-user { justify-content: flex-end; }
.dibo-msg-bubble {
  max-width: 82%; padding: 10px 14px; border-radius: 16px;
  font-size: .82rem; line-height: 1.55;
}
.dibo-msg-bot .dibo-msg-bubble { background: #fff; color: #1a2332; border-bottom-left-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.dibo-msg-user .dibo-msg-bubble { background: linear-gradient(135deg, #e63946, #c0392b); color: #fff; border-bottom-right-radius: 4px; }
.dibo-msg-typing .dibo-msg-bubble { padding: 12px 16px; }
.dibo-typing-dots { display: flex; gap: 4px; }
.dibo-typing-dots span {
  width: 7px; height: 7px; border-radius: 50%; background: #ccc;
  animation: typingDot 1.2s ease-in-out infinite;
}
.dibo-typing-dots span:nth-child(2) { animation-delay: .2s; }
.dibo-typing-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes typingDot { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-5px); background: #e63946; } }

.dibo-advisor-quickq {
  display: flex; gap: 6px; padding: 8px 12px; flex-wrap: wrap;
  background: #fff; border-top: 1px solid #eee; flex-shrink: 0;
}
.dibo-advisor-quickq button {
  background: #fde8ea; color: #e63946; border: none; border-radius: 20px;
  padding: 6px 12px; font-size: .7rem; font-weight: 700; cursor: pointer;
  white-space: nowrap;
}

.dibo-advisor-input-row {
  display: flex; gap: 8px; padding: 10px 12px 14px;
  background: #fff; border-top: 1px solid #eee; flex-shrink: 0;
}
.dibo-advisor-input {
  flex: 1; border: 1.5px solid #e8ecf0; border-radius: 14px;
  padding: 10px 14px; font-size: .84rem; outline: none;
  font-family: inherit;
}
.dibo-advisor-input:focus { border-color: #e63946; }
.dibo-advisor-send {
  width: 44px; height: 44px; border-radius: 14px; border: none;
  background: linear-gradient(135deg, #e63946, #c0392b); color: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
}

/* ===== AI WYCENA PAGE ===== */
.wycena-camera-container {
  position: relative;
  width: 100%;
  min-height: 260px;
  max-height: 340px;
  background: #0a0a0a;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wycena-camera-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: rgba(255,255,255,.4);
  cursor: pointer;
  width: 100%;
  height: 260px;
  border: 2px dashed rgba(255,255,255,.15);
  border-radius: 16px;
  margin: 4px;
}
.wycena-camera-placeholder span {
  font-size: .78rem;
  font-weight: 500;
}
.wycena-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  margin-bottom: 18px;
}
.wycena-btn-capture {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: 4px solid var(--text);
  background: #fff;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s;
}
.wycena-btn-capture:active { transform: scale(.9); }
.wycena-btn-capture .capture-ring {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--text);
  transition: background .2s, transform .2s;
}
.wycena-btn-capture.active .capture-ring {
  background: var(--accent);
  transform: scale(.85);
  border-radius: 8px;
}
.wycena-btn-gallery,
.wycena-btn-flip {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--bg);
  color: var(--text);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s, background .15s;
}
.wycena-btn-gallery:active,
.wycena-btn-flip:active { transform: scale(.9); background: var(--border); }

.wycena-loading {
  text-align: center;
  padding: 30px 0;
}

/* Price Card */
.wycena-price-card {
  background: linear-gradient(135deg, #27ae60 0%, #1e8449 100%);
  color: #fff;
  border-radius: 20px;
  padding: 24px 20px;
  text-align: center;
  margin: 14px 0;
  box-shadow: 0 6px 24px rgba(39,174,96,.25);
}
.wpc-label {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  opacity: .85;
  margin-bottom: 4px;
}
.wpc-price {
  font-size: 2.2rem;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.wpc-detail {
  font-size: .78rem;
  opacity: .8;
  margin-top: 6px;
}
.wpc-market {
  font-size: .72rem;
  opacity: .65;
  margin-top: 4px;
}
.wpc-confidence {
  font-size: .7rem;
  font-weight: 700;
  margin-top: 8px;
  background: rgba(255,255,255,.18);
  display: inline-block;
  padding: 2px 12px;
  border-radius: 10px;
}

/* Info Grid */
.wycena-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.wig-tile {
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  border: 1px solid var(--border);
}
.wig-label {
  font-size: .68rem;
  color: var(--text-light);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.wig-val {
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
}

/* Tech Card */
.wycena-tech-card {
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  border: 1px solid var(--border);
  margin-bottom: 10px;
}
.wtc-title {
  font-size: .8rem;
  font-weight: 800;
  margin-bottom: 12px;
  color: var(--text);
}
.wtc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid var(--border);
  font-size: .8rem;
}
.wtc-row:last-child { border-bottom: none; }
.wtc-row span { color: var(--text-light); }
.wtc-row strong { color: var(--text); font-weight: 600; font-size: .78rem; text-align: right; max-width: 55%; }

/* Warnings */
.wycena-warnings {
  background: #FFF8E1;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 10px;
  border: 1px solid #FFE082;
}
.ww-item {
  font-size: .78rem;
  color: #6D4C00;
  padding: 3px 0;
  padding-left: 14px;
  position: relative;
}
.ww-item::before {
  content: '⚠';
  position: absolute;
  left: 0;
  font-size: .7rem;
}

/* Tip */
.wycena-tip {
  font-size: .78rem;
  color: var(--blue);
  background: #E3F2FD;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.4;
}

/* Rates Form */
.wycena-rate-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.wycena-rate-row:last-child { border-bottom: none; }
.wycena-rate-row label {
  font-size: .84rem;
  font-weight: 600;
  color: var(--text);
}
.wycena-rate-input {
  display: flex;
  align-items: center;
  gap: 6px;
}
.wycena-rate-input input {
  width: 70px;
  text-align: center;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  padding: 7px 4px;
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
  background: var(--bg);
  outline: none;
  transition: border-color .2s;
}
.wycena-rate-input input:focus {
  border-color: var(--green);
}
.wycena-rate-input span {
  font-size: .75rem;
  color: var(--text-light);
  font-weight: 500;
}

/* History */
.wycena-history-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  background: #fff;
  border-radius: 14px;
  margin-bottom: 8px;
  border: 1px solid var(--border);
  cursor: pointer;
  transition: transform .12s, box-shadow .15s;
  -webkit-tap-highlight-color: transparent;
}
.wycena-history-item:active {
  transform: scale(.98);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.whi-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #E8F5E9;
  color: var(--green);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.whi-info { flex: 1; min-width: 0; }
.whi-title {
  font-size: .84rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.whi-sub {
  font-size: .72rem;
  color: var(--text-light);
  margin-top: 2px;
}
.whi-right { text-align: right; flex-shrink: 0; }
.whi-price {
  font-size: .88rem;
  font-weight: 800;
  color: var(--green);
}
.whi-date {
  font-size: .68rem;
  color: var(--text-light);
  margin-top: 2px;
}

/* ── WYCENA HINT PANEL (low-confidence retry) ── */
.wycena-hint-panel {
  background: #FFF8E1;
  border: 1.5px solid #FFE082;
  border-radius: 16px;
  padding: 16px;
  margin-top: 12px;
}
.whp-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: .85rem;
  color: #F59E0B;
  margin-bottom: 6px;
}
.whp-desc {
  font-size: .78rem;
  color: #6D4C00;
  line-height: 1.5;
  margin-bottom: 10px;
}

/* ── MONITOR ZYSKU NA ŻYWO ── */
.profit-monitor-card {
  background: #1a2332;
  border-radius: var(--radius);
  padding: 16px 14px;
  cursor: pointer;
  transition: opacity .15s;
}
.profit-monitor-card:active { opacity: .88; }
.pmc-row {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 14px;
}
.pmc-item {
  flex: 1;
  text-align: center;
}
.pmc-label {
  font-size: .6rem;
  font-weight: 700;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 3px;
}
.pmc-val {
  font-size: .82rem;
  font-weight: 800;
  color: #fff;
}
.pmc-sep {
  font-size: 1rem;
  color: rgba(255,255,255,.25);
  font-weight: 300;
  flex-shrink: 0;
  padding: 0 2px;
}
.pmc-result {
  border-top: 1px solid rgba(255,255,255,.12);
  padding-top: 12px;
  text-align: center;
}
.pmc-result-label {
  font-size: .65rem;
  font-weight: 700;
  color: rgba(255,255,255,.45);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.pmc-result-val {
  font-size: 1.5rem;
  font-weight: 800;
  color: #4ade80;
  letter-spacing: -.025em;
  margin-top: 3px;
}
.pmc-empty {
  text-align: center;
  padding: 10px 0 4px;
  font-size: .78rem;
  color: rgba(255,255,255,.4);
}
/* Profit Monitor Modal */
.pm-section { margin-bottom: 20px; }
.pm-label {
  font-size: .8rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 8px;
}
.pm-hint {
  font-size: .72rem;
  color: var(--text-light);
  margin-top: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.pm-autofill-btn {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 4px 10px;
  font-size: .7rem;
  font-weight: 700;
  cursor: pointer;
}
.pm-add-btn {
  width: 100%;
  padding: 10px;
  background: transparent;
  border: 1.5px dashed var(--border);
  border-radius: var(--radius-sm);
  font-size: .78rem;
  font-weight: 600;
  color: var(--text-light);
  cursor: pointer;
  margin-top: 8px;
}
.pm-cost-row {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-bottom: 6px;
}
.pm-cost-name { flex: 2; }
.pm-cost-amt  { flex: 1; }
.pm-cost-del {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fde8ea;
  color: var(--danger);
  border: none;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
}
.pm-nl-wrap { margin-top: 14px; }
.pm-result-card {
  background: var(--bg);
  border-radius: var(--radius);
  padding: 16px;
  margin: 16px 0;
}
.pm-result-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .82rem;
  font-weight: 600;
  padding: 5px 0;
}
.pm-minus span:first-child { color: var(--text-light); }
.pm-result-divider {
  border-top: 1.5px solid var(--border);
  margin: 8px 0;
}
.pm-total {
  font-size: 1rem;
  font-weight: 800;
}

/* ===== VOICE ASSISTANT BETA ===== */

/* Dashboard BETA card */
.dash-voice-beta-card {
  position: relative;
  background: #1a2332;
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 10px;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(26,35,50,.25);
  transition: transform .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.dash-voice-beta-card:active { transform: scale(.97); }
.vb-badge {
  position: absolute; top: 10px; right: 12px;
  font-size: .56rem; font-weight: 800; letter-spacing: .12em;
  color: #fff; background: var(--accent); border-radius: 6px; padding: 2px 8px;
}
.vb-content { display: flex; align-items: center; gap: 14px; }
.vb-icon {
  width: 48px; height: 48px; border-radius: 14px;
  background: rgba(46,163,242,.15); color: var(--accent);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.vb-text { flex: 1; min-width: 0; }
.vb-title { font-size: .92rem; font-weight: 700; color: #fff; margin-bottom: 3px; }
.vb-subtitle { font-size: .68rem; color: rgba(255,255,255,.45); line-height: 1.4; }
.vb-arrow { margin-left: auto; color: rgba(255,255,255,.3); flex-shrink: 0; }

/* ── Voice Bottom Bar ── */
.voice-bar {
  display: none;
  position: fixed;
  left: 0; right: 0;
  bottom: calc(var(--nav-height) + var(--safe-bottom));
  z-index: 650;
  background: #111820;
  border-top: 1px solid rgba(255,255,255,.08);
  flex-direction: column;
  align-items: center;
  padding: 0 12px 8px;
  box-shadow: 0 -4px 24px rgba(0,0,0,.35);
}
.voice-bar.show { display: flex; animation: vbarSlideUp .25s ease; }
@keyframes vbarSlideUp {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

.vbar-wave {
  width: 100%; height: 44px;
  display: block;
  opacity: .7;
}

.vbar-transcript {
  width: 100%;
  min-height: 0;
  max-height: 60px;
  overflow-y: auto;
  font-size: .82rem;
  font-weight: 500;
  color: #fff;
  text-align: center;
  line-height: 1.45;
  padding: 0 8px;
  word-break: break-word;
  scrollbar-width: none;
}
.vbar-transcript:empty { display: none; }
.vbar-transcript::-webkit-scrollbar { display: none; }

.vbar-action {
  width: 100%;
  text-align: center;
  font-size: .75rem;
  font-weight: 600;
  padding: 0 8px;
  min-height: 0;
  transition: opacity .2s;
}
.vbar-action:empty { display: none; }
.vbar-action.success { color: #4ade80; }
.vbar-action.error   { color: #f87171; }
.vbar-action.info    { color: #7dd3fc; }
.vbar-action.thinking { color: var(--orange); }

.vbar-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding-top: 6px;
}

.vbar-mic {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--accent);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .2s, box-shadow .2s, transform .1s;
  -webkit-tap-highlight-color: transparent;
}
.vbar-mic:active { transform: scale(.9); }
.vbar-mic.listening {
  background: #27ae60;
  box-shadow: 0 0 0 4px rgba(39,174,96,.3);
  animation: vbarPulse 1.2s ease infinite;
}
.vbar-mic.processing {
  background: var(--orange);
  box-shadow: 0 0 0 4px rgba(243,156,18,.25);
}
@keyframes vbarPulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(39,174,96,.3); }
  50%      { box-shadow: 0 0 0 10px rgba(39,174,96,.08); }
}

.vbar-status {
  flex: 1;
  font-size: .78rem;
  font-weight: 600;
  color: rgba(255,255,255,.5);
}

.vbar-x {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  border: none;
  color: rgba(255,255,255,.45);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
}

/* ═══ ORDER HISTORY — Inspota style ═══ */
.oh-section {
  margin-top: 24px; padding-top: 20px; border-top: 2px solid #f0f2f5;
}
.oh-section-head {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px;
}
.oh-section-title {
  display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: .95rem;
}
.oh-section-icon {
  width: 30px; height: 30px; border-radius: 9px;
  background: #1a2332;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.oh-section-stats { font-size: .7rem; color: #888; }
.oh-summary-row {
  display: flex; gap: 8px; margin-bottom: 14px;
}
.oh-summary-item {
  flex: 1; background: #f8f9fb; border-radius: 12px; padding: 10px;
  text-align: center; border: 1.5px solid #eef1f5;
}
.oh-summary-num { font-weight: 900; font-size: 1.1rem; color: #1a2332; }
.oh-summary-label { font-size: .62rem; color: #999; margin-top: 2px; text-transform: uppercase; letter-spacing: .04em; }
.oh-filters {
  display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap;
}
.oh-card {
  background: #fff; border-radius: 14px; border: 1.5px solid #eef1f5;
  padding: 14px; margin-bottom: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.oh-card-top {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px;
}
.oh-card-id { font-weight: 800; font-size: .8rem; color: #1a2332; }
.oh-card-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: .65rem; font-weight: 700; padding: 4px 9px; border-radius: 20px;
}
.oh-card-date { font-size: .68rem; color: #aaa; margin-bottom: 10px; }
.oh-progress {
  display: flex; align-items: center; margin-bottom: 10px;
}
.oh-step {
  width: 10px; height: 10px; border-radius: 50%;
  background: #e0e0e0; flex-shrink: 0;
}
.oh-step-done { background: #2d9b4e; }
.oh-step-line { flex: 1; height: 2px; background: #eee; }
.oh-step-line:has(~ .oh-step-done) { background: #2d9b4e; }
.oh-items-list { border-top: 1px solid #f0f0f0; padding-top: 8px; margin-bottom: 6px; }
.oh-item-row {
  display: flex; align-items: center; gap: 6px;
  font-size: .72rem; padding: 3px 0;
}
.oh-item-name { flex: 1; color: #555; }
.oh-item-qty { color: #999; font-weight: 600; }
.oh-item-price { font-weight: 700; color: #1a2332; }
.oh-card-total {
  display: flex; justify-content: space-between;
  border-top: 1px solid #f0f0f0; padding-top: 8px;
  font-size: .78rem; color: #666;
}
.oh-card-total strong { color: #1a2332; font-weight: 800; }
.oh-empty { text-align: center; padding: 30px 16px; color: #aaa; font-size: .8rem; line-height: 1.6; }

/* ═══ AUTH SCREEN ═══ */
/* ═══════════════════════════════════════════════════════════════
   AUTH / LOGIN SCREEN — premium DiBO, Apple-grade
   ═══════════════════════════════════════════════════════════════ */
.auth-screen {
  position: fixed; inset: 0; z-index: 9999;
  /* jasny środek przesunięty w dół — strefa statusu/notcha jest jednolicie ciemna (bez „poświaty") */
  background: radial-gradient(ellipse 130% 75% at 50% 44%, #243447 0%, #1d2a3a 52%, #121a26 100%);
  display: flex; align-items: center; justify-content: center;
  padding: 28px 20px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Animowane orby w tle */
.auth-bg-orbs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.auth-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  animation: authOrb 9s ease-in-out infinite;
}
.auth-orb-1 {
  top: -22%; left: -18%;
  width: 340px; height: 340px;
  background: radial-gradient(circle, rgba(149,193,31,.34) 0%, transparent 70%);
}
.auth-orb-2 {
  bottom: -20%; right: -15%;
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(124,179,66,.45) 0%, transparent 70%);
  animation-delay: -3s; animation-duration: 11s;
}
.auth-orb-3 {
  top: 50%; left: 65%;
  width: 240px; height: 240px;
  background: radial-gradient(circle, rgba(227,6,19,.30) 0%, transparent 65%);
  animation-delay: -5s; animation-duration: 13s;
}
@keyframes authOrb {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(40px, -50px) scale(1.12); }
  66% { transform: translate(-30px, 40px) scale(.92); }
}

.auth-stack {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  animation: authStackIn .5s cubic-bezier(.2,.8,.3,1);
}
@keyframes authStackIn {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* HERO */
.auth-hero {
  text-align: center;
  padding-top: 8px;
}
.auth-badge-wrap {
  position: relative;
  width: 120px;
  height: 120px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.auth-badge-img {
  width: 120px;
  height: 120px;
  object-fit: contain;
  filter: drop-shadow(0 10px 28px rgba(149,193,31,.4));
  position: relative;
  z-index: 2;
  animation: authBadgeBreathe 2.6s ease-in-out infinite;
}
@keyframes authBadgeBreathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}
.auth-badge-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid #95c11f;
  opacity: 0;
  animation: authRing 2.4s ease-out infinite;
}
.auth-badge-ring.r2 { animation-delay: 1.2s; }
@keyframes authRing {
  0% { transform: scale(.85); opacity: .55; }
  100% { transform: scale(1.65); opacity: 0; }
}

.auth-brand-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 0 14px 0;
  padding: 0;
  font-weight: inherit;
}
.auth-brand-amb {
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .38em;
  color: rgba(255,255,255,.78);
  text-transform: uppercase;
  margin-bottom: 6px;
}
.auth-brand-dibo {
  font-size: 3.2rem;
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: 1;
  background: linear-gradient(135deg, #fff 0%, #d1f0c2 50%, #95c11f 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 50px rgba(149,193,31,.5);
}
.auth-tagline-line {
  font-size: .98rem;
  color: rgba(255,255,255,.75);
  font-weight: 500;
}
.auth-tagline-line b {
  color: #95c11f;
  font-weight: 800;
  text-shadow: 0 0 18px rgba(149,193,31,.6);
}

/* GŁÓWNA KARTA Z CTA */
.auth-card {
  background: rgba(255,255,255,.98);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 28px;
  padding: 28px 24px 22px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.4) inset,
    0 30px 60px rgba(0,0,0,.45),
    0 8px 24px rgba(149,193,31,.18);
  position: relative;
  overflow: hidden;
}
.auth-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, #95c11f 0%, #7cb342 50%, #95c11f 100%);
}

.auth-card-title {
  text-align: center;
  font-size: 1.15rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.02em;
  margin: 0 0 8px 0;
  padding: 0;
  line-height: 1.3;
}
.auth-card-sub {
  text-align: center;
  font-size: .88rem;
  color: #6b7589;
  line-height: 1.5;
  margin-bottom: 22px;
}

/* Features grid */
.auth-about {
  margin-bottom: 18px;
  padding: 14px 16px;
  background: #f8faf5;
  border-radius: 14px;
  border: 1px solid #ecf3e3;
}
.auth-about p {
  margin: 0;
  font-size: .72rem;
  line-height: 1.55;
  color: #3a4a5c;
}
.auth-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 26px;
}
.auth-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 6px 12px;
  background: #f8faf5;
  border-radius: 14px;
  font-size: .7rem;
  font-weight: 700;
  color: #1d2a3a;
  text-align: center;
  letter-spacing: .01em;
  border: 1px solid #ecf3e3;
}
.af-ico {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #95c11f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(149,193,31,.32);
}
.af-ico svg { width: 18px; height: 18px; }

/* Google button — HERO */
.auth-btn-google {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 18px 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
  color: #1d2a3a;
  border: 1.5px solid #e5e7eb;
  border-radius: 16px;
  font-size: 1rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: -.005em;
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 6px 16px rgba(15,23,42,.10),
    0 2px 4px rgba(15,23,42,.06);
  transition: transform .12s, box-shadow .15s, border-color .15s;
  position: relative;
}
.auth-btn-google:active {
  transform: scale(.98);
  box-shadow: 0 2px 6px rgba(15,23,42,.10);
}
.auth-btn-google:hover {
  border-color: #95c11f;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 8px 24px rgba(149,193,31,.18);
}
.abg-icon {
  display: inline-flex;
  align-items: center;
}
.abg-text {
  flex: 1;
  text-align: left;
}
.abg-arrow {
  display: inline-flex;
  align-items: center;
  color: #95c11f;
  transition: transform .2s;
}
.auth-btn-google:hover .abg-arrow {
  transform: translateX(3px);
}

.auth-secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
  font-size: .72rem;
  color: #9ca3af;
  font-weight: 600;
  letter-spacing: .01em;
}
.auth-secure svg { color: #95c11f; }

/* Stopka */
.auth-foot-brand {
  text-align: center;
  font-size: .72rem;
  color: rgba(255,255,255,.55);
  font-weight: 500;
  line-height: 1.6;
  padding: 4px 0;
}
.auth-foot-brand b { color: rgba(255,255,255,.8); font-weight: 800; }
.auth-foot-tag {
  display: block;
  margin-top: 6px;
  font-size: .68rem;
  color: rgba(149,193,31,.7);
  letter-spacing: .25em;
  font-weight: 700;
}

.auth-error {
  color: #b91c1c;
  background: #fef2f2;
  border-left: 4px solid #ef4444;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: .82rem;
  font-weight: 600;
}

/* Legacy form support (hidden but styled) */
.auth-tabs { display: flex; background: #f0f2f5; border-radius: 12px; padding: 3px; margin-bottom: 20px; gap: 3px; }
.auth-tab { flex: 1; padding: 8px; border: none; border-radius: 10px; font-size: .8rem; font-weight: 700; cursor: pointer; background: transparent; color: #888; transition: all .15s; }
.auth-tab.active { background: #fff; color: #1a2332; box-shadow: 0 1px 4px rgba(0,0,0,.1); }
.auth-input {
  width: 100%; padding: 11px 14px; border: 1.5px solid #e0e4ea;
  border-radius: 12px; font-size: .84rem; outline: none;
  font-family: inherit; box-sizing: border-box; transition: border-color .15s;
  margin-bottom: 10px;
}
.auth-input:focus { border-color: #95c11f; }
.auth-btn-primary {
  width: 100%; padding: 13px; background: #95c11f;
  color: #1d2a3a; border: none; border-radius: 14px; font-size: .88rem;
  font-weight: 800; cursor: pointer; margin-top: 8px;
}

@keyframes authFadeOut { to { opacity: 0; transform: scale(.95); } }

/* ═══════════════════════════════════════════════════════════════
   PREMIUM POLISH LAYER (v23)
   Cel: lepsza czytelność, mniej upakowane UI, jaśniejsza hierarchia.
   Te reguły siedzą na końcu, więc nadpisują wcześniejsze deklaracje.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --shadow:    0 1px 2px rgba(15,23,42,.04), 0 1px 3px rgba(15,23,42,.05);
  --shadow-lg: 0 4px 16px rgba(15,23,42,.06), 0 12px 32px rgba(15,23,42,.08);
  --shadow-soft: 0 1px 0 rgba(15,23,42,.04), 0 6px 18px rgba(15,23,42,.05);
  --border: #ececf1;
  --border-soft: #f1f2f6;
  --text-muted: #8a93a3;
  --radius: 18px;
  --radius-sm: 14px;
}

html {
  font-size: 15.5px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Konsekwentny rytm na każdej stronie */
.page { padding: 14px 16px 18px; }

/* ── Section header — unify ────────────────────────────── */
.section-title {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -.02em;
  margin: 14px 2px 10px;
}

/* Małe sekcje — capsy używamy oszczędnie, większe i jaśniej */
.dash-actions-label,
.trust-section-label {
  font-size: .72rem !important;
  letter-spacing: .08em !important;
  font-weight: 700 !important;
  color: var(--text-muted) !important;
  text-transform: uppercase;
}

/* ── Cards — softer, more premium ──────────────────────── */
.card,
.dash-section,
.dash-stat-tile,
.dash-action,
.crm-card,
.auto-item {
  box-shadow: var(--shadow-soft) !important;
  border: 1px solid var(--border) !important;
}

.card { padding: 18px 16px; border-radius: var(--radius); }

/* ── Bottom nav — czytelniejsze etykiety, lekki pill na aktywnym ── */
.bottom-nav {
  height: calc(64px + var(--safe-bottom));
  box-shadow: 0 -1px 0 var(--border), 0 -8px 24px rgba(15,23,42,.04);
}
.nav-item {
  font-size: .68rem !important;
  gap: 4px !important;
  padding: 8px 4px !important;
  letter-spacing: -.005em;
}
.nav-item svg {
  width: 22px !important;
  height: 22px !important;
  stroke-width: 1.7 !important;
  transition: transform .2s, stroke .2s;
}
.nav-item.active {
  color: #1d2a3a !important;
}
/* Aktywna ikona — granat na zielonym pill (czysty kontrast, bez skalowania/poświaty) */
.nav-item.active svg { stroke: #1d2a3a !important; stroke-width: 2 !important; }
.nav-item.active span {
  color: #1d2a3a;
  font-weight: 700;
}
.nav-item.active::after { display: none !important; }
.nav-item .badge {
  top: 6px;
  right: calc(50% - 20px);
  background: var(--accent);
  box-shadow: 0 0 0 2px var(--card);
}

/* ── Header — odrobinę więcej luzu ─────────────────────── */
.app-header {
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.app-header .logo { font-size: 1.05rem; letter-spacing: -.01em; }

/* ── Dashboard hero — czytelność daty ─────────────────── */
.dash-hero { padding: 8px 0 20px; }
.dash-date {
  font-size: .82rem;
  color: var(--text-muted);
  margin-bottom: 6px;
  text-transform: capitalize;
}
.dash-name { font-size: 1.78rem; letter-spacing: -.035em; }
.dash-hero-badge {
  font-size: .62rem;
  padding: 5px 10px;
  border-radius: 10px;
  letter-spacing: .12em;
}

/* ── Dashboard stat tiles — większe etykiety ──────────── */
.dash-stats-grid { gap: 12px; margin-bottom: 18px; }
.dash-stat-tile {
  padding: 18px 16px 16px;
  border-radius: 20px;
}
.dst-val { font-size: 2.2rem; }
.dst-label {
  font-size: .74rem;
  color: var(--text-muted);
  margin-top: 4px;
  font-weight: 600;
  letter-spacing: 0;
}

/* ── Dashboard quick action tiles ─────────────────────── */
.dash-actions-label {
  padding: 4px 4px 10px !important;
}
.dash-actions-row { gap: 10px; margin-bottom: 14px; }
.dash-action {
  padding: 14px 6px 12px;
  border-radius: var(--radius-sm);
  font-size: .72rem;
  gap: 8px;
}
.da-icon {
  width: 42px; height: 42px;
  border-radius: 12px;
}

/* ── Sekcja-grupa — wytchnienie ───────────────────────── */
.dash-section {
  padding: 14px 16px 10px;
  border-radius: var(--radius);
}
.dash-section-hdr { margin-bottom: 12px; }
.dash-section-hdr > span { font-size: .94rem; letter-spacing: -.01em; }
.dash-section-hdr > button { font-size: .78rem; color: var(--accent); font-weight: 600; }

/* ── CRM header ──────────────────────────────────────── */
.crm-header { margin-bottom: 16px; }
.crm-header-title { font-size: 1.45rem; letter-spacing: -.03em; }
.crm-header-sub { font-size: .78rem; color: var(--text-muted); margin-top: 3px; }
.crm-add-btn {
  border-radius: 14px;
  padding: 10px 16px;
  font-size: .8rem;
  box-shadow: 0 4px 12px rgba(46,163,242,.22);
}
.crm-search {
  padding: 13px 14px 13px 42px;
  border-radius: 14px;
  background: #f5f6f9;
  border-color: transparent;
}
.crm-search-icon { left: 16px; }

/* ── CRM pipeline filter — czytelność liczb i etykiet ── */
.crm-pipeline {
  gap: 7px;
  margin: 14px 0 16px;
}
.crm-pipe-stage {
  padding: 11px 4px 9px;
  border-radius: 12px;
  background: #f5f6f9;
  border: 1.5px solid transparent;
}
.crm-pipe-num {
  font-size: 1.18rem;
  color: var(--primary);
  font-weight: 800;
}
.crm-pipe-label {
  font-size: .58rem;
  margin-top: 4px;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: .06em;
}
.crm-pipe-stage.active {
  background: #fff;
  border-color: var(--primary);
  box-shadow: 0 4px 14px rgba(15,23,42,.08);
}
.crm-pipe-stage.active .crm-pipe-num { color: var(--primary); }
.crm-pipe-stage.active .crm-pipe-label { color: var(--primary); }

/* ── CRM alerty (wycena/follow-up) — łagodniejsze ────── */
.crm-alert {
  padding: 12px 14px;
  border-radius: 14px;
  margin-bottom: 10px;
  border: 1px solid var(--border-soft);
}
.crm-alert-title { font-size: .85rem; font-weight: 700; }
.crm-alert-desc { font-size: .72rem; opacity: .8; margin-top: 2px; }
.crm-alert-icon {
  width: 38px; height: 38px;
  border-radius: 11px;
  box-shadow: none;
}

/* ── CRM lead card — porządek wizualny ───────────────── */
.crm-card {
  padding: 14px 14px;
  border-radius: 16px;
  margin-bottom: 10px;
}
.crm-feed-header { margin: 18px 0 10px; }
.crm-feed-header #crmFeedTitle {
  font-size: .7rem !important;
  letter-spacing: .08em !important;
  font-weight: 800 !important;
  color: #9ca3af !important;
  text-transform: uppercase;
}

/* ── Form polish ─────────────────────────────────────── */
.form-input, .form-textarea, .form-select {
  padding: 12px 14px;
  border-radius: 12px;
  border-color: var(--border);
}
.form-label { font-size: .82rem; }

/* ── Trust dashboard — drobne ─────────────────────────── */
.trust-g-stat-label,
.trust-section-desc,
.income-tip-tag {
  font-size: .62rem;
}

/* ── Tagi/badge'y — minimum czytelności ──────────────── */
.tag, .order-tag, .crm-rev-tag, .auto-task-badge {
  font-size: .68rem;
  letter-spacing: .02em;
}

/* ── More menu overlay — drag handle wider ───────────── */
#moreMenuOverlay > div > div:first-child {
  width: 44px !important;
  height: 5px !important;
  background: #d6d8df !important;
}

/* ── Subtle focus rings (a11y) ───────────────────────── */
button:focus-visible,
.nav-item:focus-visible,
.form-input:focus-visible {
  outline: 2px solid rgba(46,163,242,.55);
  outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   CALM PALETTE (v24) — koniec chaosu kolorów
   Jeden akcent (DiBO blue), neutralne ikony, status = mała kropka.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --neutral-50:  #f5f6f9;
  --neutral-100: #eef0f5;
  --neutral-200: #e3e6ee;
  --ink:         #1a2332;
  --ink-2:       #4b5563;
  --ink-3:       #8a93a3;
}

/* ── Stat tiles + Quick actions — bez szarego boxa wokół ikony (Apple clean) ─── */
.dst-icon,
.da-icon {
  background: transparent !important;
  color: #6b7280 !important;
  border: 0 !important;
  box-shadow: none !important;
}
.stat-icon,
.crm-alert-icon {
  background: var(--neutral-50);
  color: var(--ink);
}
.dst-icon svg,
.da-icon svg {
  stroke: #6b7280 !important;
  fill: none !important;
}
/* Akcent zielony dla "Umówione" (4ta karta Pulpitu) */
.dash-stat-tile:nth-child(4) .dst-icon svg { stroke: #95c11f !important; }

/* Stat-icon klasy kolorowe — neutralizacja */
.stat-icon.red,
.stat-icon.green,
.stat-icon.blue,
.stat-icon.orange {
  background: var(--neutral-50) !important;
  color: var(--ink) !important;
}

/* ── CRM lead card — porządek bez krzyku ─────────────── */
.crm-card-clean {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--border) !important;
}
.crm-card-bar {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  border-radius: 3px 0 0 3px;
}
.crm-card-avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--neutral-100);
  color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem;
  flex-shrink: 0;
  letter-spacing: .02em;
}
.crm-card-name {
  font-weight: 700;
  font-size: .92rem;
  color: var(--ink);
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.crm-card-price {
  font-size: .78rem;
  font-weight: 700;
  color: var(--ink);
  margin-left: auto;
  white-space: nowrap;
}
.crm-card-meta {
  font-size: .75rem;
  color: var(--ink-3);
  margin-top: 3px;
}
.crm-card-call {
  width: 40px; height: 40px;
  border-radius: 12px;
  background: var(--neutral-50);
  color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  text-decoration: none;
  transition: background .15s, transform .1s;
}
.crm-card-call:active {
  background: var(--neutral-100);
  transform: scale(.94);
}
.crm-next-action {
  display: inline-flex !important;
  background: var(--neutral-50) !important;
  color: var(--ink-2) !important;
  font-size: .66rem !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  margin-top: 6px !important;
  letter-spacing: 0 !important;
}

/* ── Wycisz wszystkie gradienty na przyciskach AI ────── */
.income-ai-btn,
.trust-profile-ai-btn,
.auto-agent-btn {
  background: var(--ink) !important;
  box-shadow: 0 4px 14px rgba(15,23,42,.2) !important;
}
.income-ai-icon,
.trust-gapi-icon,
.auto-hero-icon,
.auto-agent-avatar {
  background: rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}

/* Czarne karty AI — bez świecenia */
.dash-income-ai-card,
.auto-agent-card,
.auto-hero,
.crm-ai-bar-inner {
  background: #131c2a !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: 0 4px 16px rgba(15,23,42,.12) !important;
}
.auto-agent-glow { display: none !important; }
.auto-agent-card { border-color: rgba(255,255,255,.06) !important; }

/* Bottom nav badge — neutralny granat zamiast czerwonego punktu */
.nav-item .badge {
  background: var(--ink) !important;
}

/* CRM add btn — DiBO zielony jako CTA */
.crm-add-btn {
  background: #95c11f !important;
  box-shadow: 0 2px 6px rgba(149,193,31,.3) !important;
}

/* Sklepowe i inne ceny w listach — jednolity granat */
.oh-price { color: var(--ink) !important; }

/* CRM alerty — łagodne tła zamiast pełnokolorowych */
.crm-alert {
  background: #fff !important;
  border: 1px solid var(--border-soft) !important;
}
.crm-alert-icon { background: var(--neutral-50) !important; }

/* "Wszyscy klienci" suma — neutralny ink-3 */
.crm-feed-header .crm-rev-tag,
.crm-feed-header span[style*="color"] {
  color: var(--ink-3) !important;
  background: transparent !important;
  font-weight: 700 !important;
}

/* Trust auto badge (BETA, etc.) — neutralny granat */
.trust-auto-badge { background: var(--ink) !important; }

/* Animacja "migania" cards — zmniejsz, zostaw subtelne */
.crm-card:active,
.dash-stat-tile:active,
.dash-action:active {
  transform: scale(.98) !important;
  opacity: 1 !important;
}

/* Quick action button — bez tła pastelowego, ten sam neutralny */
.dash-action { color: var(--ink) !important; }

/* Stat values — ten sam granat dla wszystkich */
.stat-value, .dst-val { color: var(--ink) !important; }

/* ── Follow-up Center — zero migania, jednolite tło ─── */
.fu-center {
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-soft) !important;
}
.fu-center-head {
  background: var(--ink) !important;
}
.fu-center-icon {
  background: rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
.fu-center-badge {
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  animation: none !important;
}
.fu-center-badge[data-urgent="true"] { animation: none !important; }

.fu-urgency-bar {
  background: #fff !important;
  border-bottom: 1px solid var(--border) !important;
}
.fu-urg-critical,
.fu-urg-warm,
.fu-urg-soon {
  background: var(--neutral-50) !important;
  color: var(--ink) !important;
}
.fu-urg-critical .fu-urg-num,
.fu-urg-warm .fu-urg-num,
.fu-urg-soon .fu-urg-num { color: var(--ink); }

.fu-center-footer { background: #fafbfc !important; }
.fu-empty-title { color: var(--ink-2) !important; }

/* CRM pipeline kolorowe liczby — neutralizacja kropką pod */
.crm-pipe-num[style*="color"] { color: var(--ink) !important; }

/* Inline overrides (Edytuj/Zarządzaj zielone/niebieskie) — szanuj polish */
.dash-section-hdr > button[style*="color"] {
  color: var(--ink-2) !important;
  font-weight: 600 !important;
}

/* Pulse / glow keyframes globalnie wyłącz, oprócz toastów */
@keyframes fuPulse { from {} to {} }

/* Profit monitor card — bez krzyku */
.profit-monitor-card { box-shadow: var(--shadow-soft) !important; }

/* Quick action active pulsing — gładko */
.dash-action:active { background: var(--neutral-50) !important; }

/* ── Follow-up card (Hotel Marina) — wyciszone CTA ──── */
.fu-card-avatar[style] {
  background: var(--neutral-100) !important;
  color: var(--ink) !important;
}
.fu-card-days[style] {
  color: var(--ink) !important;
}
.fu-card-label[style] {
  background: var(--neutral-50) !important;
  color: var(--ink-2) !important;
}
.fu-action-btn {
  border: 1px solid var(--border) !important;
  background: #fff !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
.fu-action-btn:active { background: var(--neutral-50) !important; }
/* Primary CTA (Zadzwoń) — pierwszy fu-action-btn */
.fu-card-actions .fu-action-btn:first-child {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
}

/* Monitor Zysku — header bez zielonego "Edytuj" */
#profitMonitorSection .dash-section-hdr > button[style*="green"],
#profitMonitorSection .dash-section-hdr > button {
  color: var(--ink-2) !important;
  font-weight: 600 !important;
}

/* "+ Dodaj" jakikolwiek button — neutralny */
.crm-add-btn { color: #1d2a3a !important; }

/* Aktywne zlecenia / Ostatnie opinie — section header buttons neutral */
.dash-section .dash-section-hdr > button {
  color: var(--accent) !important;
  font-weight: 600 !important;
}

/* "W toku" / "Umówione" status tagi w listach zleceń ── */
.list-item .tag,
.list-item span[style*="background"] {
  background: var(--neutral-50) !important;
  color: var(--ink-2) !important;
  border: 1px solid var(--border-soft) !important;
}

/* ── CRM alerts (czerwone/fioletowe/pomarańczowe pasy) ── */
.crm-alert[style] {
  background: #fff !important;
  border: 1px solid var(--border) !important;
}
.crm-alert-icon[style] {
  background: var(--neutral-50) !important;
  color: var(--ink) !important;
}
.crm-alert-title[style],
.crm-alert-desc[style] {
  color: var(--ink) !important;
}
.crm-alert-desc[style] { color: var(--ink-3) !important; }

/* Strzałka po prawej w alercie — szarość */
.crm-alert > span[style*="color"] { color: var(--ink-3) !important; }

/* "Wszyscy klienci · 15 000 zł" — neutralna kwota po prawej */
.crm-feed-header > div:last-child,
.crm-feed-header span:not(#crmFeedTitle) {
  color: var(--ink) !important;
  background: transparent !important;
  font-weight: 700 !important;
}

/* ── AI Asystent Techniczny — restrained green accent ── */
.ai-tech-card {
  border: 1px solid var(--border) !important;
  background: #fff;
  padding: 16px;
}
.ai-beta-badge {
  display: inline-block;
  vertical-align: 1px;
  margin-left: 6px;
  padding: 2px 8px;
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #64748b;
  background: #eef1f5;
  border: 1px solid #e2e6ee;
  border-radius: 999px;
  line-height: 1.45;
}
/* Premium pill „AI” — przy nazwie asystenta */
.ai-pill {
  display: inline-block;
  vertical-align: 1px;
  margin-left: 6px;
  padding: 2px 8px;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .1em;
  color: #5a8a1e;
  background: #eef7e0;
  border: 1px solid #d9ecbb;
  border-radius: 999px;
  line-height: 1.4;
}

/* ── Skrót Asystent DiBO na Pulpicie — czysty biały card (shadcn) ── */
.dash-ai-shortcut {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 16px 18px;
  margin: 16px 0 0;
  background: #ffffff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 1rem;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  transition: box-shadow .2s, transform .12s, border-color .2s;
  box-shadow: 0 1px 3px rgba(15,23,42,.04), 0 4px 12px -2px rgba(15,23,42,.04);
  position: relative;
  overflow: hidden;
}
.dash-ai-shortcut:active { transform: scale(.995); }
.dash-ai-shortcut:hover {
  border-color: rgba(149,193,31,.4);
  box-shadow: 0 4px 14px -2px rgba(149,193,31,.18);
}
.das-ico {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(15,23,42,.06);
}
.das-ico img { width: 32px; height: 32px; object-fit: contain; }
.das-ico svg { width: 22px !important; height: 22px !important; stroke: currentColor; fill: none; }
.das-text { flex: 1; min-width: 0; }
.das-title {
  font-size: .95rem;
  font-weight: 700;
  color: #1d2a3a;
  letter-spacing: -.01em;
}
.das-sub {
  font-size: .76rem;
  color: #6b7280;
  margin-top: 3px;
}
.das-arrow { color: #cbd5e1; flex-shrink: 0; }
.das-arrow svg { width: 18px !important; height: 18px !important; stroke: currentColor; fill: none; }

/* ── Modal Asystent DiBO ── */
.ai-modal-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.ai-modal-ico {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(15,23,42,.08);
  overflow: hidden;
}
.ai-modal-ico img { width: 34px; height: 34px; object-fit: contain; }
.ai-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f3f4f6;
  border: 0;
  color: #6b7280;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s;
  z-index: 2;
}
.ai-modal-close:hover { background: #e5e7eb; color: #1d2a3a; }
.ai-modal-close svg { width: 18px !important; height: 18px !important; stroke: currentColor; fill: none; }

.ai-quick-label {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: 8px;
}
.ai-quick-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ai-quick-chip {
  padding: 8px 12px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
  color: #1d2a3a;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  -webkit-tap-highlight-color: transparent;
}
.ai-quick-chip:hover { border-color: #95c11f; background: #f0fdf4; color: #5a7811; }
.ai-quick-chip:active { transform: scale(.96); }

/* ── Toggle trybu: Pisanie / Zdjęcie ── */
.ai-mode-toggle {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: #f3f4f6;
  border-radius: 12px;
  margin-bottom: 16px;
}
.ai-mode-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 10px;
  background: transparent;
  border: 0;
  border-radius: 9px;
  font-size: .85rem;
  font-weight: 600;
  color: #6b7280;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  -webkit-tap-highlight-color: transparent;
}
.ai-mode-btn svg { width: 16px !important; height: 16px !important; stroke: currentColor; fill: none; }
.ai-mode-btn.active {
  background: #ffffff;
  color: #1d2a3a;
  box-shadow: 0 1px 3px rgba(15,23,42,.1);
}
.ai-beta-mini {
  font-size: .56rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #95c11f;
  background: #f0fdf4;
  padding: 1px 5px;
  border-radius: 4px;
}

/* ── Tryb zdjęcie ── */
.ai-photo-note {
  font-size: .82rem;
  color: #6b7280;
  line-height: 1.5;
  margin-bottom: 14px;
  padding: 12px 14px;
  background: #f5f6f9;
  border-radius: 14px;
}
.ai-photo-note b { color: #8b94a3; font-weight: 600; }
.ai-photo-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 28px 16px;
  background: #f9fafb;
  border: 2px dashed #d1d5db;
  border-radius: 14px;
  color: #6b7280;
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  -webkit-tap-highlight-color: transparent;
}
.ai-photo-drop svg { width: 28px !important; height: 28px !important; stroke: #95c11f; fill: none; }
.ai-photo-drop:hover { border-color: #95c11f; background: #f0fdf4; }

/* Dwa przyciski: aparat / galeria */
.ai-photo-btns { display: flex; gap: 10px; }
.ai-photo-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 28px 16px;
  background: #f9fafb;
  border: 1.5px dashed #d1d5db;
  border-radius: 14px;
  color: #6b7280;
  font-size: .88rem;
  font-weight: 600;
}
.ai-photo-pick {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 22px 12px;
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.12);
  border-radius: 16px;
  color: #1d2a3a;
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: -.01em;
  cursor: pointer;
  font-family: inherit;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  transition: background .12s, transform .1s;
  -webkit-tap-highlight-color: transparent;
}
.ai-photo-pick svg { width: 24px !important; height: 24px !important; stroke: #3a4150 !important; fill: none !important; stroke-width: 1.6 !important; }
.ai-photo-pick:active { transform: scale(.97); background: #fafafc; }

/* Modal m² otwierany Z WNĘTRZA formularza klienta — musi być NAD nim */
#aiAreaModal { z-index: 700; }
/* Asystent też ponad standardowe modale (gdyby wołany z formularza) */
#aiTechModal { z-index: 680; }

/* Hybryda — podpowiedzi przy szacowaniu m² */
.ai-area-hints {
  margin-top: 14px;
  padding: 12px;
  background: #f9fafb;
  border-radius: 12px;
}
.ai-area-hints-label {
  font-size: .72rem;
  font-weight: 700;
  color: #6b7280;
  margin-bottom: 8px;
}

/* Wynik szacowania m² */
.ai-area-result {
  margin-top: 14px;
  padding: 16px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 14px;
  text-align: center;
}
.ai-area-result.is-error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
  text-align: left;
  font-size: .88rem;
  line-height: 1.4;
}
.aar-big {
  font-size: 2.4rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.03em;
  line-height: 1;
}
.aar-range { font-size: .82rem; color: #6b7280; margin-top: 4px; }
.aar-conf {
  display: inline-block;
  margin-top: 8px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
}
.aar-conf-wysoka { background: #dcfce7; color: #166534; }
.aar-conf-średnia, .aar-conf-srednia { background: #fef3c7; color: #92400e; }
.aar-conf-niska { background: #fee2e2; color: #b91c1c; }
.aar-how {
  text-align: left;
  font-size: .8rem;
  color: #374151;
  margin-top: 12px;
  line-height: 1.45;
  padding: 10px;
  background: #ffffff;
  border-radius: 8px;
}
.aar-how b { color: #1d2a3a; }
.aar-desc { font-size: .8rem; color: #6b7280; margin-top: 8px; }
.aar-warn { font-size: .74rem; color: #b45309; font-weight: 600; margin-top: 10px; }
.aar-use {
  margin-top: 14px;
  width: 100%;
  padding: 13px;
  background: #95c11f;
  color: #1d2a3a;
  border: 0;
  border-radius: 12px;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  box-shadow: 0 4px 14px rgba(149,193,31,.3);
  transition: all .15s;
}
.aar-use:hover { box-shadow: 0 6px 18px rgba(149,193,31,.45); }
.aar-use:active { transform: scale(.98); }
.ai-photo-preview {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
}
.ai-photo-preview img {
  width: 100%;
  max-height: 280px;
  object-fit: cover;
  display: block;
  border-radius: 14px;
}
.ai-photo-remove {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(15,23,42,.7);
  border: 0;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.ai-photo-remove svg { width: 14px !important; height: 14px !important; stroke: currentColor; fill: none; }

/* ── CRM: przycisk oszacuj m² ze zdjęcia ── */
.lead-ai-area-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  justify-content: center;
  padding: 11px 14px;
  margin-bottom: 6px;
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  font-size: .85rem;
  font-weight: 600;
  color: #1d2a3a;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  -webkit-tap-highlight-color: transparent;
}
.lead-ai-area-btn svg { width: 16px !important; height: 16px !important; stroke: #95c11f; fill: none; }
.lead-ai-area-btn:hover { border-color: #95c11f; background: #f0fdf4; }
.lead-ai-area-btn:active { transform: scale(.98); }
.lead-ai-area-btn:disabled { opacity: .7; cursor: default; }
.lead-ai-area-note {
  font-size: .74rem;
  color: #6b7280;
  line-height: 1.4;
  margin-bottom: 14px;
  padding: 8px 10px;
  background: #fffbeb;
  border-radius: 8px;
}
.lead-ai-area-note b { color: #b45309; }

/* Pole pytania + przycisk wyczyść */
.ai-input-wrap { position: relative; }
.ai-input-clear {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #f3f4f6;
  border: 0;
  color: #6b7280;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s;
}
.ai-input-clear:hover { background: #e5e7eb; color: #1d2a3a; }
.ai-input-clear svg { width: 14px !important; height: 14px !important; stroke: currentColor; fill: none; }

/* ── Markdown w odpowiedzi AI ── */
.ai-resp-body .ai-md-p {
  margin: 0 0 8px;
  line-height: 1.5;
  font-size: .9rem;
  color: #1d2a3a;
}
.ai-resp-body .ai-md-p:last-child { margin-bottom: 0; }
.ai-resp-body .ai-md-ul {
  margin: 4px 0 10px;
  padding-left: 18px;
  list-style: none;
}
.ai-resp-body .ai-md-ul li {
  position: relative;
  padding-left: 6px;
  margin-bottom: 5px;
  line-height: 1.45;
  font-size: .9rem;
  color: #374151;
}
.ai-resp-body .ai-md-ul li::before {
  content: '';
  position: absolute;
  left: -10px;
  top: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #95c11f;
}
.ai-resp-body strong { color: #1d2a3a; font-weight: 700; }
.ai-tech-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.ai-tech-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #e9f6ee;
  color: #1b7a35;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ai-tech-meta { flex: 1; min-width: 0; }
.ai-tech-meta .card-title {
  font-size: 1rem;
  font-weight: 800;
  color: var(--ink);
  margin: 0;
  letter-spacing: -.01em;
}
.ai-tech-meta .card-subtitle {
  font-size: .78rem;
  color: var(--ink-3);
  margin-top: 2px;
}
.ai-tech-btn {
  background: var(--ink) !important;
  color: #fff !important;
  padding: 13px !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(15,23,42,.18) !important;
}
.ai-tech-btn:active { transform: scale(.98); }
/* ═══ Czat z Asystentem DiBO — zwykła rozmowa (dymki) ═══ */
.ai-chat-thread {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@keyframes aiRespIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
.ai-chat-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  animation: aiRespIn .28s cubic-bezier(.16,1,.3,1);
}
.ai-chat-row.user { justify-content: flex-end; }
.ai-chat-row.bot  { justify-content: flex-start; }
.ai-chat-ava {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e5e7eb;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(29,42,58,.12);
}
.ai-chat-ava img { width: 100%; height: 100%; object-fit: contain; padding: 2px; display: block; }
.ai-chat-bubble {
  max-width: 82%;
  padding: 11px 14px;
  border-radius: 16px;
  font-size: .9rem;
  line-height: 1.55;
  word-wrap: break-word;
}
.ai-chat-bubble.user {
  background: #1d2a3a;
  color: #fff;
  border-bottom-right-radius: 5px;
}
.ai-chat-bubble.user .ai-chat-qtext { color: #fff; white-space: pre-wrap; }
.ai-chat-bubble.bot {
  background: #fff;
  color: #374151;
  border: 1px solid hsl(240 5.9% 90%);
  border-bottom-left-radius: 5px;
  box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 10px 24px -16px rgba(15,23,42,.18);
}
.ai-chat-bubble.bot.is-error { border-color: #f3c7c0; background: #fffaf9; }
.ai-chat-bubble.bot .ai-resp-body { font-size: .9rem; line-height: 1.6; color: #374151; }
.ai-chat-photo {
  display: block;
  width: 100%;
  max-width: 220px;
  border-radius: 10px;
  margin-bottom: 6px;
}
/* przycisk Kopiuj w dymku bota */
.ai-chat-bubble .ai-resp-copy {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 10px;
  background: #f8fafc;
  border: 1px solid hsl(240 5.9% 90%);
  color: #1d2a3a;
  padding: 6px 12px;
  border-radius: 9px;
  font-size: .74rem;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .15s, color .15s, background .15s, transform .1s;
}
.ai-chat-bubble .ai-resp-copy::before {
  content: '';
  width: 13px; height: 13px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E") center/contain no-repeat;
}
.ai-chat-bubble .ai-resp-copy:hover { border-color: #95c11f; color: #5a8a1e; background: #fbfdf6; }
.ai-chat-bubble .ai-resp-copy:active { transform: scale(.97); }
/* plakietka źródła — buduje zaufanie do odpowiedzi */
.ai-src {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: .68rem; font-weight: 700;
  line-height: 1.3;
}
.ai-src .ai-src-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.ai-src.ok  { color: #5a8a1e; background: #eef7e0; border: 1px solid #d9ecbb; }
.ai-src.ok  .ai-src-dot { background: #95c11f; }
.ai-src.gen { color: #92702a; background: #fbf3e2; border: 1px solid #efe1c2; }
.ai-src.gen .ai-src-dot { background: #d9a93a; }
.ai-src + .ai-resp-copy { margin-top: 8px; display: flex; }
/* wskaźnik „pisze..." */
.ai-chat-bubble.ai-typing {
  display: inline-flex; gap: 4px; align-items: center;
  padding: 14px 16px;
}
.ai-chat-bubble.ai-typing span {
  width: 7px; height: 7px; border-radius: 50%;
  background: #c2c8d0;
  animation: aiTyping 1.2s infinite ease-in-out;
}
.ai-chat-bubble.ai-typing span:nth-child(2) { animation-delay: .2s; }
.ai-chat-bubble.ai-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes aiTyping {
  0%, 60%, 100% { transform: translateY(0); opacity: .5; }
  30% { transform: translateY(-4px); opacity: 1; }
}

/* ── Profile session card (z przyciskiem Wyloguj) ─────── */
.profile-session {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 14px;
  background: #f5f6f9;
  border: 1px solid #e3e6ee;
  border-radius: 14px;
}
.profile-session-info { flex: 1; min-width: 0; }
.profile-session-label {
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #8a93a3;
}
.profile-session-email {
  font-size: .92rem;
  font-weight: 700;
  color: #1a2332;
  margin-top: 3px;
  word-break: break-all;
}
.profile-session-role {
  display: inline-block;
  margin-top: 5px;
  padding: 3px 9px;
  border-radius: 8px;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .04em;
  background: #fff;
  color: #4b5563;
  border: 1px solid #e3e6ee;
}
.profile-session-role.owner {
  background: #fef3c7;
  color: #92400e;
  border-color: #fbbf24;
}
.btn-logout {
  flex-shrink: 0;
  background: #fff;
  color: #c0392b;
  border: 1px solid #f3c7c0;
  border-radius: 12px;
  padding: 10px 14px;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background .15s, transform .1s;
}
.btn-logout:active { background: #fde8ea; transform: scale(.96); }

.profile-notifications {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
  padding: 14px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
}
.pn-info { flex: 1; min-width: 0; }
.pn-title {
  font-size: .92rem;
  font-weight: 800;
  color: #1a2332;
}
.pn-desc {
  font-size: .72rem;
  color: #8a93a3;
  margin-top: 3px;
  line-height: 1.4;
}
.pn-btn {
  flex-shrink: 0;
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 10px 18px;
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s;
}
.pn-btn:active { transform: scale(.96); }
.pn-btn:disabled { cursor: default; opacity: .8; }


/* ═══════════════════════════════════════════════════════════════
   FAZA 3 — MVP nav: Pulpit / CRM / Kalendarz / Profil
   ═══════════════════════════════════════════════════════════════ */

/* ── Schowane moduły / DiBO Advisor ────────────────────────── */
.mvp-hidden,
.dibo-advisor-fab,
.dibo-advisor-floating,
#diboAdvisorFloating,
#diboAdvisorFab,
#voiceBar,
#voiceBetaCard,
.hidden-nav-legacy {
  display: none !important;
}

/* ── Auth screen — intro pod Google ────────────────────────── */
.auth-google-intro {
  text-align: center;
  margin: 18px 0;
  padding: 0 8px;
}
.auth-intro-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ink, #1a2332);
  margin-bottom: 6px;
  letter-spacing: -.01em;
}
.auth-intro-desc {
  font-size: .8rem;
  color: var(--ink-3, #8a93a3);
  line-height: 1.5;
}

/* ── Calendar page (placeholder) ───────────────────────────── */
#page-calendar { padding: 14px 16px 28px; }
.cal-header { margin-bottom: 14px; padding: 4px 2px 0; }
.cal-title {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -.03em;
  color: var(--ink, #1a2332);
}
.cal-subtitle {
  font-size: .8rem;
  color: var(--ink-3, #8a93a3);
  margin-top: 3px;
}

.cal-connect-card {
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 18px;
  padding: 22px 18px;
  text-align: center;
  margin-bottom: 18px;
  box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 6px 18px rgba(15,23,42,.05);
}
.cal-connect-icon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: #e8f0fe;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}
.cal-connect-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ink, #1a2332);
  margin-bottom: 6px;
  letter-spacing: -.01em;
}
.cal-connect-desc {
  font-size: .82rem;
  color: var(--ink-2, #4b5563);
  line-height: 1.55;
  margin-bottom: 16px;
}
.cal-connect-btn {
  background: var(--ink, #1a2332);
  color: #fff;
  border: none;
  border-radius: 14px;
  padding: 12px 22px;
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  transition: transform .1s;
}
.cal-connect-btn:active { transform: scale(.97); }
.cal-connect-status {
  font-size: .68rem;
  color: var(--ink-3, #8a93a3);
  font-style: italic;
}

.cal-today-section { margin-top: 22px; }
.cal-section-label {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--ink-3, #8a93a3);
  margin: 0 2px 10px;
}
.cal-empty-state {
  text-align: center;
  padding: 32px 18px;
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 16px;
}
.cal-empty-state svg { margin-bottom: 10px; }
.cal-empty-title {
  font-size: .92rem;
  font-weight: 700;
  color: var(--ink-2, #4b5563);
  margin-bottom: 6px;
}
.cal-empty-desc {
  font-size: .78rem;
  color: var(--ink-3, #8a93a3);
  line-height: 1.5;
}

/* ── Calendar — connected state ─────────────────────────── */
.cal-refresh-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}
.cal-refresh-btn {
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 10px;
  padding: 7px 12px;
  font-size: .75rem;
  font-weight: 600;
  color: var(--ink-2, #4b5563);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.cal-refresh-btn:active { background: var(--neutral-50, #f5f6f9); }

.cal-events-section { margin-bottom: 22px; }

.cal-event-card {
  display: flex;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: transform .1s, box-shadow .15s;
}
.cal-event-card:active { transform: scale(.985); box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.cal-event-time {
  flex-shrink: 0;
  width: 80px;
  border-right: 1px solid var(--border-soft, #f1f2f6);
  padding-right: 10px;
}
.cal-event-date {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-3, #8a93a3);
}
.cal-event-hour {
  font-size: .88rem;
  font-weight: 800;
  color: var(--ink, #1a2332);
  margin-top: 2px;
  line-height: 1.2;
}
.cal-event-body { flex: 1; min-width: 0; }
.cal-event-title {
  font-size: .92rem;
  font-weight: 700;
  color: var(--ink, #1a2332);
  letter-spacing: -.01em;
  line-height: 1.3;
}
.cal-event-location {
  font-size: .75rem;
  color: var(--ink-2, #4b5563);
  margin-top: 3px;
}
.cal-event-desc {
  font-size: .72rem;
  color: var(--ink-3, #8a93a3);
  margin-top: 4px;
  line-height: 1.4;
  white-space: pre-wrap;
}

.cal-empty-mini {
  text-align: center;
  padding: 22px 14px;
  background: var(--neutral-50, #f5f6f9);
  border-radius: 12px;
  color: var(--ink-3, #8a93a3);
  font-size: .82rem;
}

.cal-loading {
  text-align: center;
  padding: 30px 16px;
  color: var(--ink-3, #8a93a3);
  font-size: .85rem;
}

.cal-spin {
  animation: calSpin 1s linear infinite;
}
@keyframes calSpin { to { transform: rotate(360deg); } }

/* Event badges (źródło: DiBO lead vs Google) */
.cal-event-badges {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.cal-event-badge {
  display: inline-block;
  font-size: .58rem;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 5px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.cal-event-badge.dibo { background: #e63946; color: #fff; }
.cal-event-badge.synced { background: #d1fae5; color: #047857; border: 1px solid #6ee7b7; }
.cal-event-badge.gcal { background: #e3f2fd; color: #1565c0; }

.cal-event-card.dibo { border-color: #fda4af !important; background: linear-gradient(180deg, #fff5f7 0%, #fff 30%); }
.cal-event-card.gcal { border-color: #bfdbfe !important; }

.cal-event-sync-btn {
  margin-top: 8px;
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.cal-event-sync-btn:active { transform: scale(.96); }

.cal-gcal-warning {
  background: #fef3c7;
  border: 1px solid #fbbf24;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  font-size: .78rem;
  color: #78350f;
  display: flex;
  align-items: center;
  gap: 8px;
}
.cal-gcal-warning span { flex: 1; }
.cal-gcal-warning-btn {
  background: #92400e;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

/* ── Toggle lista/grid + FullCalendar embed ──────────────── */
.cal-view-toggle {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
  align-items: center;
}
.cal-view-btn {
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 0.625rem;
  padding: 8px 14px;
  font-size: .82rem;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
  transition: all .15s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.cal-view-btn svg { width: 16px !important; height: 16px !important; stroke: currentColor; fill: none; flex-shrink: 0; }
.cal-view-btn.active {
  background: #1d2a3a;
  color: #fff;
  border-color: #1d2a3a;
}

/* ═══════════════════════════════════════════════════════════════
   FullCalendar — Google Calendar look-alike
   ═══════════════════════════════════════════════════════════════ */
#fcCalendar {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 12px 8px 8px;
  font-size: .82rem;
  --fc-border-color: #ececf1;
  --fc-today-bg-color: rgba(46,163,242,.06);
  --fc-now-indicator-color: #ea4335;
  --fc-event-border-color: transparent;
  --fc-page-bg-color: #fff;
  --fc-neutral-bg-color: #fafafa;
  --fc-list-event-hover-bg-color: #f5f6f9;
  --fc-highlight-color: rgba(46,163,242,.15);
}

/* Toolbar (top header z tytułem + nawigacją) */
#fcCalendar .fc-header-toolbar {
  margin-bottom: 14px !important;
  flex-wrap: wrap;
  gap: 8px;
}
#fcCalendar .fc-toolbar-title {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #1a2332;
  text-transform: capitalize;
  letter-spacing: -.01em;
}

/* Buttons w toolbar */
#fcCalendar .fc-button {
  font-size: .78rem !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
#fcCalendar .fc-button-primary {
  background: #fff !important;
  border-color: #e5e7eb !important;
  color: #4b5563 !important;
  box-shadow: none !important;
}
#fcCalendar .fc-button-primary:not(:disabled).fc-button-active,
#fcCalendar .fc-button-primary:not(:disabled):hover {
  background: #f5f6f9 !important;
  border-color: #d1d5db !important;
  color: #1a2332 !important;
}
#fcCalendar .fc-button-primary:not(:disabled).fc-button-active {
  background: #1a2332 !important;
  color: #fff !important;
  border-color: #1a2332 !important;
}
#fcCalendar .fc-today-button { font-weight: 700 !important; }

/* Day headers (Pn, Wt, Śr…) */
#fcCalendar .fc-col-header-cell {
  background: #fff;
  border-bottom: 1px solid #ececf1;
  padding: 8px 4px;
}
#fcCalendar .fc-col-header-cell-cushion {
  font-size: .72rem;
  font-weight: 700;
  color: #4b5563;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 4px;
}

/* Today highlight w nagłówku */
#fcCalendar .fc-day-today .fc-col-header-cell-cushion {
  color: #2ea3f2;
  background: #e3f2fd;
  border-radius: 8px;
}
#fcCalendar .fc-day-today {
  background: var(--fc-today-bg-color) !important;
}

/* Hour slots — wyraźne linie godzin (jak Google) */
#fcCalendar .fc-timegrid-slot {
  height: 42px !important;
  border-bottom: 1px solid #f1f2f6;
}
#fcCalendar .fc-timegrid-slot-minor {
  border-top-style: dotted;
}
#fcCalendar .fc-timegrid-slot-label {
  font-size: .68rem;
  font-weight: 600;
  color: #8a93a3;
  padding-right: 8px;
  vertical-align: top;
}
#fcCalendar .fc-timegrid-axis {
  font-size: .68rem;
  color: #8a93a3;
}

/* Now indicator (czerwona linia "teraz" jak w Google) */
#fcCalendar .fc-timegrid-now-indicator-line {
  border-color: #ea4335;
  border-width: 2px;
}
#fcCalendar .fc-timegrid-now-indicator-arrow {
  border-color: #ea4335;
  background: #ea4335;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  top: -5px;
  margin-left: -2px;
  border: none;
}

/* Events — Google look */
#fcCalendar .fc-event {
  border-radius: 6px !important;
  padding: 3px 6px !important;
  font-size: .72rem !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
}
#fcCalendar .fc-event:hover { opacity: .92; }
#fcCalendar .fc-event-main { line-height: 1.3; }
#fcCalendar .fc-event-time { font-weight: 700; opacity: .85; }
#fcCalendar .fc-event-title { font-weight: 600; }

/* All-day events */
#fcCalendar .fc-timegrid-allday-cushion { padding: 2px 0; }

/* Grid lines */
#fcCalendar .fc-scrollgrid {
  border: none !important;
}
#fcCalendar .fc-scrollgrid td,
#fcCalendar .fc-scrollgrid th {
  border-color: #ececf1 !important;
}

/* Hide pesky "more" indicator background */
#fcCalendar .fc-more-link {
  font-size: .68rem;
  color: #2ea3f2;
  font-weight: 700;
}

/* Mobile dostosowania */
@media (max-width: 700px) {
  #fcCalendar { padding: 8px 4px; }
  #fcCalendar .fc-toolbar-title { font-size: .95rem !important; }
  #fcCalendar .fc-button { font-size: .72rem !important; padding: 5px 9px !important; }
  #fcCalendar .fc-timegrid-slot { height: 38px !important; }
  #fcCalendar .fc-col-header-cell-cushion { font-size: .68rem; }
  #fcCalendar .fc-event { font-size: .68rem !important; padding: 2px 4px !important; }
}

#fcCalendar a { text-decoration: none !important; }
#fcCalendar .fc-list-day-cushion { background: #f5f6f9 !important; }
#fcCalendar .fc-list-event-title a { color: #1a2332 !important; font-weight: 600; }


/* ═══════════════════════════════════════════════════════════════
   CRM — REDESIGN v2 (HubSpot/Pipedrive style)
   Cel: ambasador pijany wie co robić · zero szumu · jasna hierarchia
   ═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   CRM REDESIGN v3 — Apple stat cards + Hero task
   ═══════════════════════════════════════════════════════════════ */

/* ── HERO TASK CARD — "Kolejne zadanie" ───────────────────── */
/* Hero task — granat brand card (DiBO premium signature) */
.hero-task {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #1d2a3a;
  color: #fff;
  border-radius: 0.75rem;
  padding: 20px;
  margin: 16px 0;
  box-shadow: 0 10px 25px -5px rgb(15 23 42 / .25), 0 0 0 1px rgb(255 255 255 / .04) inset;
  position: relative;
  overflow: hidden;
}
.hero-task::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #95c11f, transparent);
}
.hero-task::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -10%;
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(255,255,255,.06) 0%, transparent 70%);
  pointer-events: none;
}
/* Icon w hero task (CRM) — Liquid Glass + brand accent */
.hero-task-icon {
  width: 44px;
  height: 44px;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(149,193,31,.16);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(149,193,31,.24);
  color: #b1d63d;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
}
.hero-task-icon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.5; }
.hero-task-icon.today  { background: rgba(149,193,31,.18); border-color: rgba(149,193,31,.3); color: #b1d63d; }
.hero-task-icon.soon   { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.18); color: #ffffff; }
.hero-task-icon.urgent { background: rgba(227,6,19,.22); border-color: rgba(227,6,19,.35); color: #ff6b78; animation: heroUrgentPulse 2s ease-in-out infinite; }
.hero-task-icon.quote  { background: rgba(149,193,31,.18); border-color: rgba(149,193,31,.3); color: #b1d63d; }
.hero-task-icon.pool   { background: rgba(149,193,31,.18); border-color: rgba(149,193,31,.3); color: #b1d63d; }
@keyframes heroUrgentPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(234,67,53,.5); }
  50% { box-shadow: 0 0 0 12px rgba(234,67,53,0); }
}

.hero-task-body { flex: 1; min-width: 0; }
.hero-task-label {
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.6);
  margin-bottom: 4px;
}
.hero-task-title {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero-task-sub {
  font-size: .78rem;
  color: rgba(255,255,255,.65);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hero-task-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
/* Buttons w hero task — primary brand + ghost Liquid Glass */
.hero-task-btn {
  background: rgba(255,255,255,.08);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  color: #ffffff;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 0.5rem;
  padding: 0 14px;
  font-size: .875rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  gap: 6px;
  transition: all .15s ease;
  font-family: inherit;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
}
.hero-task-btn svg { width: 16px !important; height: 16px !important; stroke: #ffffff; fill: none; stroke-width: 1.7; flex-shrink: 0; }
.hero-task-btn:active { transform: scale(.96); }
.hero-task-btn:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.24);
  transform: translateY(-1px);
}
.hero-task-btn.primary {
  background: #95c11f;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  color: #1d2a3a;
  border: 0;
  box-shadow: 0 2px 8px rgb(149 193 31 / .35);
}
.hero-task-btn.primary svg { stroke: #1d2a3a !important; fill: none !important; stroke-width: 1.7 !important; }
.hero-task-btn.primary:hover { box-shadow: 0 4px 14px rgb(149 193 31 / .5); }


/* ── STAT CARDS GRID — 6 etapów (Apple Stocks style) ──────── */
.stat-grid-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 14px 0 12px;
}
@media (min-width: 760px) {
  .stat-grid-cards { grid-template-columns: repeat(6, 1fr); }
}

.stat-card-stage {
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 16px;
  padding: 12px 12px 14px;
  text-align: left;
  cursor: pointer;
  transition: all .2s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
}
.stat-card-stage:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(15,23,42,.08);
  border-color: rgba(15,23,42,.1);
}
.stat-card-stage:active { transform: translateY(0); }

.stat-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.stat-card-emoji {
  font-size: 1.05rem;
  line-height: 1;
  filter: grayscale(.2);
  transition: filter .2s, transform .2s;
}
.stat-card-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ea4335;
  box-shadow: 0 0 0 3px rgba(234,67,53,.18);
  animation: dotPulse 1.5s ease-in-out infinite;
}
@keyframes dotPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(234,67,53,.18); }
  50% { box-shadow: 0 0 0 5px rgba(234,67,53,.08); }
}

.stat-card-num {
  font-size: 1.65rem;
  font-weight: 800;
  color: #1a2332;
  line-height: 1;
  letter-spacing: -.03em;
  font-feature-settings: 'tnum';
  margin-bottom: 2px;
}
.stat-card-label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #4b5563;
  margin-bottom: 4px;
}
.stat-card-value {
  font-size: .68rem;
  color: #8a93a3;
  font-weight: 600;
  font-feature-settings: 'tnum';
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ACTIVE state — gradient dark */
.stat-card-stage.active {
  background: #1a2332;
  border-color: transparent;
  box-shadow:
    0 8px 24px rgba(15,23,42,.22),
    0 2px 6px rgba(15,23,42,.15);
  transform: translateY(-2px);
}
.stat-card-stage.active .stat-card-num,
.stat-card-stage.active .stat-card-label,
.stat-card-stage.active .stat-card-value {
  color: #fff;
}
.stat-card-stage.active .stat-card-label { color: rgba(255,255,255,.65); }
.stat-card-stage.active .stat-card-value { color: rgba(255,255,255,.75); }
.stat-card-stage.active .stat-card-emoji {
  filter: grayscale(0);
  transform: scale(1.1);
}

/* Stage subtle top accent on hover (kolorowy hint) */
.stat-card-stage.stage-pool:not(.active)::before { background: #f59e0b; }
.stat-card-stage.stage-to_call:not(.active)::before { background: #2ea3f2; }
.stat-card-stage.stage-quoted:not(.active)::before { background: #f59e0b; }
.stat-card-stage.stage-measured:not(.active)::before { background: #8b5cf6; }
.stat-card-stage.stage-scheduled:not(.active)::before { background: #22c55e; }
.stat-card-stage:not(.active)::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  opacity: 0;
  transition: opacity .2s;
}
.stat-card-stage:not(.active):hover::before { opacity: .7; }


/* ── Pipeline value summary ──────────────────────────────── */
.pipeline-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(135deg, #fef9c3 0%, #fef3c7 100%);
  border: 1px solid rgba(245,158,11,.2);
  border-radius: 14px;
  padding: 12px 16px;
  margin: 0 0 16px;
  box-shadow: 0 1px 2px rgba(245,158,11,.08);
}
.pipeline-summary .ps-label {
  font-size: .82rem;
  font-weight: 700;
  color: #92400e;
}
.pipeline-summary .ps-value {
  font-size: 1.1rem;
  font-weight: 900;
  color: #1a2332;
  font-feature-settings: 'tnum';
  letter-spacing: -.02em;
}


/* === HIDE OLD pipeline styles (legacy crm-pipeline) === */
.crm-pipeline:not(.stat-grid-cards) { display: none; }

/* Ukryj cały stary stat-grid-cards (legacy) */
.stat-grid-cards { display: none !important; }


/* ═══════════════════════════════════════════════════════════════
   STAGE SELECTOR — single big button + bottom sheet (Option B)
   ═══════════════════════════════════════════════════════════════ */

.stage-selector {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 18px;
  padding: 14px 16px;
  cursor: pointer;
  text-align: left;
  transition: all .2s cubic-bezier(.4,0,.2,1);
  box-shadow:
    0 1px 0 rgba(15,23,42,.02),
    0 4px 12px rgba(15,23,42,.05);
  margin: 14px 0 12px;
}
.stage-selector:hover {
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 rgba(15,23,42,.04),
    0 10px 24px rgba(15,23,42,.08);
}
.stage-selector:active { transform: translateY(0); }

.ss-icon-wrap {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #f5f6f9;
  color: #1a2332;
  transition: all .2s;
}
.ss-text { flex: 1; min-width: 0; }
.ss-label {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1a2332;
  letter-spacing: -.02em;
  line-height: 1.2;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ss-sub {
  font-size: .82rem;
  color: #8a93a3;
  font-weight: 500;
}
.ss-chevron {
  color: #cbd5e1;
  flex-shrink: 0;
}

/* Bottom Sheet Overlay */
.stage-sheet-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.4);
  backdrop-filter: blur(4px);
  z-index: 1000;
  display: none;
  align-items: flex-end;
  justify-content: center;
  animation: ssFadeIn .2s ease;
}
.stage-sheet-overlay.show { display: flex; }
@keyframes ssFadeIn { from { opacity: 0; } to { opacity: 1; } }

.stage-sheet {
  background: #fff;
  width: 100%;
  max-width: 560px;
  border-radius: 24px 24px 0 0;
  padding: 8px 0 20px;
  max-height: 80vh;
  overflow-y: auto;
  animation: ssSlideUp .25s cubic-bezier(.2, .8, .3, 1);
  box-shadow: 0 -10px 40px rgba(15,23,42,.2);
}
@keyframes ssSlideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.ss-drag-handle {
  width: 40px;
  height: 4px;
  background: #cbd5e1;
  border-radius: 2px;
  margin: 8px auto 16px;
}
.ss-sheet-title {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: #1a2332;
  padding: 0 20px 14px;
  border-bottom: 1px solid #f1f2f6;
}
.ss-sheet-list {
  padding: 8px 0;
  display: flex;
  flex-direction: column;
}

.ss-row {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  background: transparent;
  border: 0;
  padding: 14px 20px;
  text-align: left;
  cursor: pointer;
  transition: background .12s;
}
.ss-row:hover { background: #f5f6f9; }
.ss-row:active { background: #ececf1; }
.ss-row.active { background: #f0f9ff; }

.ss-row-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ss-row-text { flex: 1; min-width: 0; }
.ss-row-label {
  font-size: .95rem;
  font-weight: 700;
  color: #1a2332;
  letter-spacing: -.01em;
  line-height: 1.25;
}
.ss-row-meta {
  font-size: .75rem;
  color: #8a93a3;
  margin-top: 2px;
}
.ss-row-check {
  color: #22c55e;
  flex-shrink: 0;
}
.ss-row-arrow {
  color: #cbd5e1;
  flex-shrink: 0;
}


/* ═══════════════════════════════════════════════════════════════
   FIX: Sekcje vs karty leadow — visual separation
   ═══════════════════════════════════════════════════════════════ */

/* Section header (np. "WSZYSCY") — wyraźna separacja od kart */
.crm-feed-header {
  margin: 22px 4px 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #ececf1 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.crm-feed-header #crmFeedTitle {
  font-size: .78rem !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: #1a2332 !important;
}

/* Lead card — gap from header */
.lead-card:first-of-type {
  margin-top: 4px;
}


/* ═══════════════════════════════════════════════════════════════
   LEAD MODAL v3 — radykalne uproszczenie, Apple Mail style
   ═══════════════════════════════════════════════════════════════ */

/* HIDE OLD elements that competed for attention */
.ld-top,
.ld-ownership-banner,
.ld-stage-banner,
.ld-claim-btn + .ld-stage-banner,
.ld-name,
.ld-phone-btn { display: none !important; }

/* Header card — kompaktowy, wszystko widać */
.lh-header-card {
  background: #fff;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 16px;
  padding: 16px;
  margin: 0 0 16px;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
}

/* Stage row — pill stage + termin meta + ownership chip */
.lh-stage-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.lh-stage-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .72rem;
  font-weight: 800;
  padding: 5px 10px 5px 8px;
  border-radius: 8px;
  letter-spacing: -.005em;
}
.lh-stage-pill svg { width: 14px; height: 14px; }
.lh-meta {
  font-size: .72rem;
  font-weight: 600;
  color: #4b5563;
  background: #f5f6f9;
  padding: 4px 9px;
  border-radius: 8px;
}
.lh-owner-chip {
  margin-left: auto;
  font-size: .62rem;
  font-weight: 800;
  padding: 4px 9px;
  border-radius: 6px;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.lh-owner-chip.pool { background: #fef3c7; color: #92400e; }
.lh-owner-chip.mine { background: #d1fae5; color: #047857; }
.lh-owner-chip.other { background: #f1f2f6; color: #4b5563; }

/* Name + price (big) */
.lh-name-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}
.lh-name {
  font-size: 1.55rem;
  font-weight: 900;
  color: #1a2332;
  letter-spacing: -.035em;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lh-price {
  font-size: 1.15rem;
  font-weight: 800;
  color: #1a2332;
  flex-shrink: 0;
  letter-spacing: -.02em;
}

/* Service · city · m² */
.lh-meta-row {
  font-size: .85rem;
  color: #8a93a3;
  margin-bottom: 10px;
}

/* Quick actions (phone + sms) */
.lh-quick-actions {
  display: flex;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid #f1f2f6;
}
.lh-qa-btn {
  flex: 1;
  background: #f5f6f9;
  color: #1a2332;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 700;
  transition: background .15s;
}
.lh-qa-btn:active { background: #ececf1; transform: scale(.98); }


/* Pipeline — minimalne dots, bez tekstu pod */
.lh-pipeline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 12px 0 14px;
  position: relative;
}
.lh-pipeline::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 8px;
  right: 8px;
  height: 2px;
  background: #ececf1;
  z-index: 0;
}
.lh-pipe-step {
  position: relative;
  z-index: 1;
  width: 18px;
  height: 18px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
}
.lh-pipe-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ececf1;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px #ececf1;
  transition: all .2s;
}
.lh-pipe-step.done .lh-pipe-dot {
  background: #22c55e;
  box-shadow: 0 0 0 1px #22c55e;
}
.lh-pipe-step.current .lh-pipe-dot {
  background: #1a2332;
  box-shadow: 0 0 0 1px #1a2332, 0 0 0 6px rgba(26,35,50,.15);
  transform: scale(1.15);
}
.lh-pipe-step:hover .lh-pipe-dot { transform: scale(1.3); }


/* Collapsible details (Szczegóły, Zaawansowane) */
.lh-collapse {
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 14px;
  margin-top: 12px;
  overflow: hidden;
}
.lh-collapse > summary {
  padding: 14px 16px;
  font-size: .88rem;
  font-weight: 700;
  color: #1a2332;
  cursor: pointer;
  list-style: none;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background .15s;
}
.lh-collapse > summary::-webkit-details-marker { display: none; }
.lh-collapse > summary::after {
  content: '▾';
  color: #cbd5e1;
  font-size: .9rem;
  transition: transform .2s;
}
.lh-collapse[open] > summary { border-bottom: 1px solid #f1f2f6; }
.lh-collapse[open] > summary::after { transform: rotate(180deg); }
.lh-collapse:hover > summary { background: #fafbfc; }
.lh-collapse-body { padding: 14px 16px 16px; }


/* ═══════════════════════════════════════════════════════════════
   QUOTE CALCULATOR — Kalkulator wycen
   ═══════════════════════════════════════════════════════════════ */

/* Strona /wycena */
.wycena-header {
  margin: 14px 4px 18px;
}
.wycena-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.wycena-title {
  font-size: 1.6rem;
  font-weight: 900;
  color: #1a2332;
  letter-spacing: -.035em;
}
.wycena-subtitle {
  font-size: .82rem;
  color: #8a93a3;
}
.wycena-new-btn {
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 14px;
  padding: 10px 18px;
  font-size: .9rem;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(15,23,42,.22);
}
.wycena-new-btn:active { transform: scale(.97); }

.quotes-list { display: flex; flex-direction: column; gap: 10px; }
.quotes-loading, .quotes-empty {
  text-align: center;
  padding: 40px 16px;
  color: #8a93a3;
  font-size: .9rem;
}

.quote-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 14px;
  padding: 14px 16px;
  cursor: pointer;
  transition: transform .12s, box-shadow .15s;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.quote-card:active { transform: scale(.99); }
.quote-card:hover { box-shadow: 0 4px 14px rgba(15,23,42,.08); }
.q-row-1 { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.q-num { font-size: .78rem; font-weight: 700; color: #8a93a3; letter-spacing: .04em; }
.q-status {
  font-size: .62rem;
  font-weight: 800;
  padding: 3px 9px;
  border-radius: 6px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.q-st-draft { background: #f1f2f6; color: #4b5563; }
.q-st-sent { background: #dbeafe; color: #1e40af; }
.q-st-accepted { background: #d1fae5; color: #047857; }
.q-st-rejected { background: #fde8ea; color: #c0392b; }
.q-st-expired { background: #fef3c7; color: #92400e; }

.q-client {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1a2332;
  letter-spacing: -.02em;
  margin-bottom: 6px;
}
.q-row-3 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.q-amount {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1a2332;
}
.q-date {
  font-size: .72rem;
  color: #8a93a3;
}
.q-meta {
  font-size: .78rem;
  font-weight: 700;
  margin-bottom: 8px;
  padding: 5px 9px;
  border-radius: 7px;
  display: inline-block;
}
.q-meta-sent {
  background: #fef3c7;
  color: #92400e;
}
.q-meta-ok {
  background: #d1fae5;
  color: #065f46;
}


/* ── Modal kalkulator ─────────────────────────────────────── */

.qc-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.5);
  backdrop-filter: blur(4px);
  z-index: 1200;
  display: none;
  animation: ssFadeIn .2s ease;
}
.qc-modal-overlay.show {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.qc-modal {
  background: #f5f6f9;
  width: 100%;
  height: 100%;
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  animation: ssSlideUp .25s cubic-bezier(.2,.8,.3,1);
  overflow: hidden;
}

.qc-modal-header {
  background: #fff;
  padding: 14px 16px 12px;
  border-bottom: 1px solid #ececf1;
  flex-shrink: 0;
  position: relative;
}
.qc-close-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #f5f6f9;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #4b5563;
}
.qc-close-btn:active { background: #ececf1; transform: scale(.95); }
.qc-modal-title {
  font-size: 1.2rem;
  font-weight: 900;
  color: #1a2332;
  letter-spacing: -.025em;
  padding-right: 50px;
}
.qc-modal-sub {
  font-size: .78rem;
  color: #8a93a3;
  margin-top: 2px;
}

.qc-modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
}

.qc-section {
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 12px;
}
.qc-section-label {
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #4b5563;
  margin-bottom: 12px;
}

/* Lead picker */
.qc-lead-picker { margin-bottom: 8px; }
.qc-lead-display {
  background: #f5f6f9;
  border: 1.5px dashed #cbd5e1;
  border-radius: 12px;
  padding: 14px;
  cursor: pointer;
  transition: all .15s;
}
.qc-lead-display:hover { background: #ececf1; }
.qc-lead-placeholder {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #4b5563;
  font-size: .88rem;
  font-weight: 600;
}
.qc-lead-selected {
  display: flex;
  align-items: center;
  gap: 12px;
}
.qc-lead-avatar {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #1a2332;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  flex-shrink: 0;
}
.qc-lead-info { flex: 1; min-width: 0; }
.qc-lead-name { font-weight: 800; color: #1a2332; }
.qc-lead-meta { font-size: .72rem; color: #8a93a3; margin-top: 2px; }
.qc-lead-change {
  background: #fff;
  border: 1px solid #ececf1;
  border-radius: 8px;
  padding: 6px 12px;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
}

/* Items list */
.qc-items-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.qc-items-empty {
  text-align: center;
  padding: 16px;
  color: #8a93a3;
  font-size: .82rem;
  background: #f5f6f9;
  border-radius: 10px;
}
.qc-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: #f5f6f9;
  border-radius: 12px;
  padding: 10px 12px;
}
.qc-item.disabled { opacity: .55; }
.qc-item-toggle input { width: 20px; height: 20px; cursor: pointer; }
.qc-item-body { flex: 1; min-width: 0; }
.qc-item-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.qc-item-name {
  flex: 1;
  font-weight: 700;
  font-size: .92rem;
  color: #1a2332;
}
.qc-item-name-input {
  flex: 1;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: .9rem;
  font-weight: 700;
  background: #fff;
}
.qc-item-remove {
  background: transparent;
  border: none;
  color: #c0392b;
  cursor: pointer;
  padding: 4px;
}
.qc-item-individual {
  font-size: .78rem;
  color: #4b5563;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.qc-item-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .82rem;
  font-weight: 600;
}
.qc-item-area, .qc-item-rate {
  width: 80px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: .92rem;
  font-weight: 700;
  background: #fff;
}
.qc-item-rate-fixed {
  background: #fff;
  border: 1px solid #ececf1;
  border-radius: 8px;
  padding: 6px 10px;
  color: #4b5563;
  font-size: .8rem;
}
.qc-item-mul, .qc-item-eq { color: #8a93a3; }
.qc-item-total {
  margin-left: auto;
  font-weight: 800;
  color: #1a2332;
}
.qc-item-photo-btn {
  background: #fff;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: .72rem;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 60px;
  min-width: 60px;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
}
.qc-item-photo-btn:hover { background: #f5f6f9; border-color: #94a3b8; }

.qc-photos-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  align-items: center;
}
.qc-photo-thumb {
  position: relative;
  width: 60px;
  height: 60px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #ececf1;
  flex-shrink: 0;
}
.qc-photo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: zoom-in;
  display: block;
}
.qc-photo-rm {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 18px;
  height: 18px;
  background: rgba(0,0,0,.6);
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.qc-photo-rm:hover { background: rgba(220,38,38,.9); }

/* Add buttons */
.qc-add-btn {
  width: 100%;
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 12px;
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.qc-add-btn:active { transform: scale(.98); }
.qc-add-btn.ghost {
  background: #fff;
  color: #1a2332;
  border: 1.5px solid #ececf1;
  margin-top: 6px;
}

/* Discounts */
.qc-discounts { display: flex; flex-direction: column; gap: 4px; }
.qc-discount-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 6px;
  cursor: pointer;
  border-radius: 8px;
  transition: background .15s;
}
.qc-discount-row:hover { background: #f5f6f9; }
.qc-discount-row input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; }
.qc-d-text { flex: 1; font-size: .88rem; color: #1a2332; }
.qc-d-text small { display: block; font-size: .68rem; color: #8a93a3; margin-top: 2px; }
.qc-d-percent {
  background: #d1fae5;
  color: #047857;
  font-weight: 800;
  font-size: .8rem;
  padding: 3px 9px;
  border-radius: 6px;
}
.qc-discount-custom { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #ececf1; }
.qc-d-percent-input {
  width: 70px;
  border: 1.5px solid #fbbf24;
  border-radius: 8px;
  padding: 6px 8px;
  font-weight: 800;
  text-align: center;
  font-size: .9rem;
}

/* Summary */
.qc-summary {
  background: #1a2332;
  color: #fff;
  border-radius: 14px;
  padding: 16px 18px;
}
.qc-sum-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: .92rem;
}
.qc-sum-row.discount { color: #fde68a; font-weight: 700; }
.qc-sum-row.total {
  border-top: 1px solid rgba(255,255,255,.15);
  margin-top: 8px;
  padding-top: 12px;
  font-size: 1.1rem;
  font-weight: 900;
}

/* Footer (sticky bottom) */
.qc-modal-footer {
  background: #fff;
  border-top: 1px solid #ececf1;
  padding: 12px 16px calc(12px + var(--safe-bottom, 0px));
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.qc-foot-btn {
  flex: 1;
  border-radius: 12px;
  padding: 14px;
  font-size: .88rem;
  font-weight: 800;
  cursor: pointer;
  border: 1.5px solid #ececf1;
  background: #fff;
  color: #1a2332;
}
.qc-foot-btn.primary {
  background: #1a2332;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(15,23,42,.22);
  flex: 1.5;
}
.qc-foot-btn:active { transform: scale(.98); }


/* ── Lead picker for quote (bottom sheet) ────────────────── */
.lead-picker-overlay, .service-picker-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.5);
  backdrop-filter: blur(6px);
  z-index: 1300;
  display: none;
  align-items: flex-end;
  justify-content: center;
}
.lead-picker-overlay.show, .service-picker-overlay.show { display: flex; }
.lead-picker-sheet, .service-picker-sheet {
  background: #fff;
  width: 100%;
  max-width: 560px;
  border-radius: 24px 24px 0 0;
  max-height: 80vh;
  overflow-y: auto;
  animation: ssSlideUp .25s cubic-bezier(.2,.8,.3,1);
  padding: 8px 16px calc(20px + var(--safe-bottom, 0px));
}
.lp-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1a2332;
  padding: 8px 0 12px;
  letter-spacing: -.01em;
}
.lp-search { margin-bottom: 12px; }
.lp-list { display: flex; flex-direction: column; gap: 4px; max-height: 50vh; overflow-y: auto; }
.lp-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 8px;
  background: transparent;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background .15s;
}
.lp-item:hover { background: #f5f6f9; }
.lp-avatar {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #f5f6f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #1a2332;
  flex-shrink: 0;
}
.lp-info { flex: 1; min-width: 0; }
.lp-name { font-weight: 700; color: #1a2332; }
.lp-meta { font-size: .72rem; color: #8a93a3; margin-top: 2px; }
.lp-empty {
  text-align: center;
  padding: 30px 16px;
  color: #8a93a3;
  font-size: .85rem;
}
.lp-new-btn {
  margin-top: 12px;
  width: 100%;
  background: #f5f6f9;
  border: 1.5px dashed #cbd5e1;
  border-radius: 12px;
  padding: 12px;
  font-size: .85rem;
  font-weight: 700;
  color: #1a2332;
  cursor: pointer;
}
.lp-new-btn:active { background: #ececf1; }

/* Service picker categories */
.sp-categories { display: flex; flex-direction: column; gap: 14px; padding-top: 4px; }
.sp-cat-label {
  font-size: .75rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #4b5563;
  margin-bottom: 6px;
  padding-left: 4px;
}
.sp-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f5f6f9;
  border: none;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 4px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background .15s;
}
.sp-item:hover { background: #ececf1; }
.sp-item-name { font-weight: 700; color: #1a2332; font-size: .9rem; }
.sp-item-price {
  font-weight: 800;
  color: #047857;
  font-size: .85rem;
}


/* ── "Wystaw wycenę" button w lead detail ─────────────── */
.ld-quote-btn {
  width: 100%;
  margin-top: 10px;
  background: #fff;
  border: 1.5px solid #1a2332;
  color: #1a2332;
  border-radius: 12px;
  padding: 12px;
  font-size: .85rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: -.01em;
  transition: all .15s;
}
.ld-quote-btn:hover {
  background: #1a2332;
  color: #fff;
}
.ld-quote-btn:active { transform: scale(.98); }


/* ═══════════════════════════════════════════════════════════════
   PDF PREVIEW MODAL + DOCUMENT STYLES
   ═══════════════════════════════════════════════════════════════ */

.qpdf-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.7);
  z-index: 1300;
  display: none;
  flex-direction: column;
  align-items: stretch;
}
.qpdf-modal-overlay.show { display: flex; }

.qpdf-modal {
  background: #f5f6f9;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  animation: ssSlideUp .25s cubic-bezier(.2,.8,.3,1);
}
.qpdf-header {
  background: #1a2332;
  color: #fff;
  padding: 14px 16px;
  position: relative;
  flex-shrink: 0;
}
.qpdf-header .qc-close-btn {
  background: rgba(255,255,255,.15);
  color: #fff;
}
.qpdf-header .qc-close-btn:active { background: rgba(255,255,255,.25); }
.qpdf-title {
  font-size: 1.1rem;
  font-weight: 800;
  padding-right: 50px;
}
.qpdf-sub {
  font-size: .75rem;
  opacity: .7;
  margin-top: 2px;
}
.qpdf-body {
  flex: 1;
  overflow-y: auto;
  background: #d1d5db;
  padding: 20px 0;
}
.qpdf-footer {
  background: #fff;
  border-top: 1px solid #ececf1;
  padding: 12px 16px calc(12px + var(--safe-bottom, 0px));
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}


/* ════════════════════════════════════════════════════════════════
   PDF OFFER — PREMIUM DiBO BRANDING
   Layout inspirowany oryginalnym "Cennik Usług Ambasador DiBO 2026"
   Paleta: czerwień DiBO + zieleń Ambasadora + granat
   ════════════════════════════════════════════════════════════════ */

:root {
  --dibo-red:     #e30613;
  --dibo-red-dk:  #b1050f;
  --dibo-green:   #95c11f;
  --dibo-green-dk:#7cb342;
  --dibo-navy:    #1d2a3a;
  --dibo-text:    #2a3a4d;
  --dibo-muted:   #6b7589;
  --dibo-faint:   #9ca3af;
  --dibo-line:    #e5e7eb;
  --dibo-dot:     #cfd6e0;
  --dibo-bg:      #f8faf5;
}

/* Document (5 stron A4 — 794×1123 px @ 96dpi = 210×297 mm) */
.qpdf-doc {
  width: 794px;
  margin: 0 auto;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.qpdf-page {
  background: #fff;
  margin: 0 auto 24px;
  padding: 52px 60px;
  width: 794px;
  min-height: 1123px;
  box-sizing: border-box;
  box-shadow: 0 6px 24px rgba(15,23,42,.12);
  color: #2a3a4d;
  page-break-after: always;
  break-after: page;
  position: relative;
  display: flex;
  flex-direction: column;
}
.qpdf-page:last-child { margin-bottom: 0; page-break-after: auto; break-after: auto; }

/* Mobile preview tylko — w PDF zawsze 794px */
@media (max-width: 820px) {
  .qpdf-doc { width: 100%; max-width: 794px; }
  .qpdf-page { width: 100%; padding: 28px 22px; min-height: auto; }
}

/* Wspólny header strony */
.qpdf-page-head { margin-bottom: 4px; }
.qpdf-page-title {
  font-size: 2.1rem;
  font-weight: 900;
  letter-spacing: -.025em;
  color: #1d2a3a;
  text-transform: uppercase;
  margin: 0;
  line-height: 1.05;
}
.qpdf-page-title b {
  color: #e30613;
  font-weight: 900;
}
.qpdf-page-subtitle {
  font-size: .95rem;
  color: #6b7589;
  margin-top: 6px;
  font-weight: 400;
}
.qpdf-page-subtitle b { color: #7cb342; font-weight: 700; }

/* Zielona linia podziału (jak w Cenniku) */
.qpdf-divider {
  height: 3px;
  background: linear-gradient(90deg, #95c11f 0%, #95c11f 70%, transparent 100%);
  margin: 16px 0 28px;
  border-radius: 2px;
}

/* ─────────── STRONA 1: COVER ─────────── */
.qpdf-cover {
  background: #fff;
  display: flex;
  flex-direction: column;
}
.qpdf-cover-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
}
.qpdf-cover-head-text { flex: 1; }
.qpdf-cover-title {
  font-size: 3rem;
  font-weight: 900;
  color: #1d2a3a;
  letter-spacing: -.035em;
  line-height: 1;
  margin: 0;
}
.qpdf-cover-subtitle {
  font-size: 1.15rem;
  color: #2a3a4d;
  margin-top: 10px;
  font-weight: 400;
}
.qpdf-cover-subtitle b {
  font-weight: 800;
  color: #1d2a3a;
}
.qpdf-badge {
  width: 120px;
  height: 120px;
  object-fit: contain;
  flex-shrink: 0;
}

.qpdf-cover-for {
  background: #f8faf5;
  border-left: 5px solid #95c11f;
  padding: 22px 28px;
  border-radius: 0 14px 14px 0;
  margin-bottom: 28px;
}
.qpdf-cover-for-label {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .15em;
  color: #6b7589;
  font-weight: 700;
  margin-bottom: 8px;
}
.qpdf-cover-for-name {
  font-size: 1.85rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.02em;
  line-height: 1.1;
}
.qpdf-cover-for-meta {
  font-size: .92rem;
  color: #6b7589;
  margin-top: 6px;
}

/* KPI grid */
.qpdf-kpi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin-bottom: 28px;
}
.qpdf-kpi {
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  padding: 20px 18px;
  text-align: center;
  position: relative;
}
.qpdf-kpi-icon {
  width: 44px;
  height: 44px;
  margin: 0 auto 10px;
  background: #f8faf5;
  color: #7cb342;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.qpdf-kpi-icon svg { width: 22px; height: 22px; }
.qpdf-kpi-label {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #6b7589;
  font-weight: 700;
  margin-bottom: 6px;
}
.qpdf-kpi-value {
  font-size: 1.35rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.02em;
}
.qpdf-kpi-accent {
  background: #1d2a3a;
  border-color: #1d2a3a;
}
.qpdf-kpi-accent .qpdf-kpi-icon {
  background: rgba(149,193,31,.18);
  color: #95c11f;
}
.qpdf-kpi-accent .qpdf-kpi-label { color: rgba(255,255,255,.65); }
.qpdf-kpi-accent .qpdf-kpi-value { color: #fff; }

/* Cover meta (numer/data/wystawia) */
.qpdf-cover-meta {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  border-top: 1.5px solid #e5e7eb;
  border-bottom: 1.5px solid #e5e7eb;
  padding: 16px 0;
  margin-bottom: 32px;
}
.qpdf-cover-meta > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border-right: 1.5px solid #e5e7eb;
}
.qpdf-cover-meta > div:last-child { border-right: 0; }
.qpdf-cover-meta span {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #6b7589;
  font-weight: 600;
  margin-bottom: 4px;
}
.qpdf-cover-meta b {
  font-size: .95rem;
  color: #1d2a3a;
  font-weight: 800;
}

/* HERO image na cover — wypełnia przestrzeń, profesjonalny sprzęt */
.qpdf-cover-hero {
  margin: 22px 0 18px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  height: 280px;
  box-shadow: 0 12px 32px rgba(15,23,42,.18);
  background: #1d2a3a;
}
.qpdf-cover-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.qpdf-cover-hero-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 18px 22px;
  background: linear-gradient(180deg, transparent 0%, rgba(29,42,58,.92) 100%);
  color: #fff;
}
.qpdf-cover-hero-tag {
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .15em;
  color: #95c11f;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.qpdf-cover-hero-text {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -.01em;
}

.qpdf-cover-footer {
  margin-top: auto;
  background: #95c11f;
  color: #fff;
  padding: 18px 24px;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.qpdf-cover-www {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -.01em;
}
.qpdf-cover-tag {
  font-size: .85rem;
  opacity: .95;
}
.qpdf-cover-tag b { font-weight: 800; }

/* ─────────── STRONA 2: ZAKRES PRAC ─────────── */
.qpdf-cat { margin-bottom: 26px; }
.qpdf-cat-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.45rem;
  font-weight: 900;
  color: #1d2a3a;
  margin: 0 0 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid #95c11f;
  letter-spacing: -.02em;
}
.qpdf-cat-bullet {
  width: 22px;
  height: 22px;
  background: #95c11f;
  border-radius: 6px;
  display: inline-block;
  position: relative;
  flex-shrink: 0;
}
.qpdf-cat-bullet::after {
  content: '';
  position: absolute;
  inset: 4px;
  border: 2px solid #fff;
  border-radius: 3px;
}

.qpdf-cat-body { padding: 0 4px; }

/* Linia pozycji z dot-leaderem (1:1 jak Cennik) */
.qpdf-line {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 0 4px;
  font-size: 1rem;
}
.qpdf-line-name {
  font-weight: 700;
  color: #1d2a3a;
  flex-shrink: 0;
  max-width: 60%;
}
.qpdf-line-qty {
  font-weight: 400;
  color: #6b7589;
  font-size: .92em;
}
.qpdf-line-dots {
  flex: 1;
  border-bottom: 2px dotted #cfd6e0;
  margin: 0 4px 4px;
  min-width: 30px;
}
.qpdf-line-price {
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}
.qpdf-price-num {
  color: #e30613;
  font-size: 1.1rem;
  font-weight: 900;
}
.qpdf-price-ind {
  color: #7cb342;
  font-weight: 800;
  font-size: .92rem;
  font-style: italic;
}
.qpdf-unit {
  color: #7cb342;
  font-size: .78rem;
  font-weight: 600;
  margin-left: 2px;
}
.qpdf-line-total {
  font-size: .82rem;
  color: #6b7589;
  padding: 0 0 8px 4px;
}
.qpdf-line-total b { color: #1d2a3a; font-weight: 800; }
.qpdf-line-photos {
  display: flex;
  gap: 6px;
  padding: 4px 0 10px 4px;
  flex-wrap: wrap;
}
.qpdf-line-photos img {
  width: 78px;
  height: 78px;
  object-fit: cover;
  border-radius: 8px;
  border: 1.5px solid #e5e7eb;
}

/* Sekcja "ZNIŻKI I RABATY" (czerwony tytuł, zielony tekst) */
.qpdf-discounts {
  margin: 24px 0 8px;
  background: #f8faf5;
  border-radius: 14px;
  padding: 20px 24px;
  position: relative;
  border: 1.5px solid #95c11f;
}
.qpdf-discounts-title {
  font-size: 1.6rem;
  font-weight: 900;
  color: #e30613;
  letter-spacing: -.02em;
  margin-bottom: 2px;
}
.qpdf-discounts-sub {
  font-size: .85rem;
  color: #6b7589;
  margin-bottom: 14px;
}
.qpdf-discount-line .qpdf-line-name { color: #7cb342; }
.qpdf-discount-pct {
  color: #7cb342;
  font-size: 1.15rem;
  font-weight: 900;
}
.qpdf-discount-saved {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1.5px dashed #95c11f;
  text-align: right;
  font-size: .95rem;
  color: #7cb342;
}
.qpdf-discount-saved b {
  font-size: 1.1rem;
  font-weight: 900;
}

/* Summary (suma + total) */
.qpdf-summary {
  margin-top: 24px;
  background: #1d2a3a;
  border-radius: 14px;
  padding: 22px 26px;
  color: #fff;
}
.qpdf-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 6px 0;
  font-size: 1rem;
}
.qpdf-summary-row > span:last-child { font-weight: 700; }
.qpdf-summary-discount { color: #95c11f; }
.qpdf-summary-total {
  margin-top: 10px;
  padding-top: 14px;
  border-top: 2px solid rgba(255,255,255,.15);
  font-size: 1.5rem;
  font-weight: 900;
  letter-spacing: -.02em;
}
.qpdf-summary-total > span:first-child small {
  display: block;
  font-size: .55em;
  text-transform: uppercase;
  letter-spacing: .15em;
  font-weight: 600;
  opacity: .7;
}
.qpdf-summary-total > span:last-child {
  color: #95c11f;
  font-weight: 900;
}
.qpdf-summary-foot {
  margin-top: 10px;
  font-size: .75rem;
  opacity: .6;
  text-align: right;
}

/* Notes (uwagi) */
.qpdf-notes {
  margin-top: 18px;
  background: #fffbeb;
  border-left: 4px solid #f59e0b;
  padding: 14px 18px;
  border-radius: 0 10px 10px 0;
}
.qpdf-notes-label {
  font-weight: 800;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #92400e;
  margin-bottom: 4px;
}
.qpdf-notes-body {
  font-size: .92rem;
  color: #2a3a4d;
  line-height: 1.5;
}

/* ─────────── STRONA 3: DLACZEGO DiBO ─────────── */
.qpdf-why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 10px;
}
.qpdf-why-card {
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  padding: 22px 22px 20px;
  position: relative;
}
.qpdf-why-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: #f8faf5;
  color: #7cb342;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.qpdf-why-icon svg { width: 26px; height: 26px; }
.qpdf-why-card h3 {
  font-size: 1.05rem;
  font-weight: 800;
  color: #1d2a3a;
  margin: 0 0 8px;
  letter-spacing: -.01em;
}
.qpdf-why-card p {
  font-size: .88rem;
  color: #2a3a4d;
  line-height: 1.55;
  margin: 0;
}
.qpdf-why-card-accent {
  background: #1d2a3a;
  border-color: #1d2a3a;
}
.qpdf-why-card-accent .qpdf-why-icon {
  background: rgba(149,193,31,.18);
  color: #95c11f;
}
.qpdf-why-card-accent h3 { color: #fff; }
.qpdf-why-card-accent p { color: rgba(255,255,255,.82); }
.qpdf-why-card-accent p b { color: #95c11f; font-weight: 800; }

/* ─────────── STRONA 4: FAQ ─────────── */
.qpdf-faq {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.qpdf-faq-item {
  background: #f8faf5;
  border-radius: 12px;
  padding: 18px 22px;
  border-left: 4px solid #95c11f;
}
.qpdf-faq-q {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 1.02rem;
  font-weight: 800;
  color: #1d2a3a;
  margin-bottom: 8px;
  letter-spacing: -.005em;
}
.qpdf-faq-num {
  font-size: .82rem;
  font-weight: 900;
  color: #e30613;
  letter-spacing: .04em;
  flex-shrink: 0;
}
.qpdf-faq-a {
  font-size: .92rem;
  color: #2a3a4d;
  line-height: 1.6;
  padding-left: 38px;
}

/* ─────────── STRONA 5: AKCEPTACJA + KONTAKT ─────────── */
.qpdf-accept { display: flex; flex-direction: column; }

.qpdf-cta-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background: #95c11f;
  color: #fff !important;
  text-decoration: none;
  text-align: center;
  padding: 28px 24px;
  border-radius: 18px;
  margin: 20px 0 18px;
  box-shadow: 0 12px 32px rgba(149,193,31,.35);
  position: relative;
  overflow: hidden;
}
.qpdf-cta-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 0%, rgba(255,255,255,.18) 0%, transparent 60%);
  pointer-events: none;
}
.qpdf-cta-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  font-size: 1.4rem;
  font-weight: 900;
  margin-bottom: 4px;
}
.qpdf-cta-text {
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: -.01em;
  line-height: 1;
}
.qpdf-cta-sub {
  font-size: .78rem;
  opacity: .85;
  letter-spacing: .04em;
  margin-top: 2px;
}

.qpdf-accept-info {
  text-align: center;
  font-size: .92rem;
  color: #6b7589;
  padding: 0 24px;
  margin-bottom: 28px;
  line-height: 1.55;
}

/* Kontakt — w stylu wizytówki Cennika (dane Ambasadora + badge) */
.qpdf-contact-card {
  display: flex;
  align-items: center;
  gap: 24px;
  background: #f8faf5;
  border-radius: 16px;
  padding: 24px 28px;
  border: 1.5px solid #e5e7eb;
}
.qpdf-contact-badge {
  width: 110px;
  height: 110px;
  object-fit: contain;
  flex-shrink: 0;
}
.qpdf-contact-info { flex: 1; min-width: 0; }
.qpdf-contact-label {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .15em;
  color: #6b7589;
  font-weight: 700;
  margin-bottom: 4px;
}
.qpdf-contact-name {
  font-size: 1.4rem;
  font-weight: 800;
  color: #1d2a3a;
  letter-spacing: -.015em;
  margin-bottom: 12px;
}
.qpdf-contact-rows {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
}
.qpdf-contact-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .9rem;
  color: #2a3a4d;
  font-weight: 600;
}
.qpdf-contact-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: #95c11f;
  color: #fff;
  flex-shrink: 0;
}
.qpdf-contact-ico svg { width: 16px; height: 16px; }

.qpdf-foot {
  margin-top: auto;
  padding-top: 24px;
  border-top: 1.5px solid #e5e7eb;
  text-align: center;
}
.qpdf-foot-brand {
  font-size: .82rem;
  color: #6b7589;
  margin-bottom: 4px;
}
.qpdf-foot-brand b { color: #e30613; font-weight: 800; }
.qpdf-foot-meta {
  font-size: .72rem;
  color: #9ca3af;
  letter-spacing: .03em;
}

/* Mobile fit (modal preview) */
@media (max-width: 768px) {
  .qpdf-page { padding: 28px 22px; min-height: auto; }
  .qpdf-cover-title { font-size: 2rem; }
  .qpdf-cover-subtitle { font-size: 1rem; }
  .qpdf-badge { width: 80px; height: 80px; }
  .qpdf-cover-for-name { font-size: 1.4rem; }
  .qpdf-kpi-grid { grid-template-columns: 1fr; }
  .qpdf-cover-meta { grid-template-columns: 1fr; gap: 8px; }
  .qpdf-cover-meta > div { border-right: 0; border-bottom: 1px solid #e5e7eb; padding-bottom: 8px; }
  .qpdf-cover-meta > div:last-child { border-bottom: 0; }
  .qpdf-cover-footer { flex-direction: column; gap: 6px; text-align: center; }
  .qpdf-page-title { font-size: 1.5rem; }
  .qpdf-cat-title { font-size: 1.15rem; }
  .qpdf-line { flex-wrap: wrap; }
  .qpdf-line-name { max-width: 100%; }
  .qpdf-line-dots { display: none; }
  .qpdf-summary-total { font-size: 1.2rem; }
  .qpdf-why-grid { grid-template-columns: 1fr; }
  .qpdf-cta-text { font-size: 1.2rem; }
  .qpdf-contact-card { flex-direction: column; text-align: center; padding: 20px; }
  .qpdf-contact-rows { grid-template-columns: 1fr; }
  .qpdf-contact-row { justify-content: center; }
}


/* ═══════════════════════════════════════════════════════════════
   DATETIME PICKER — premium bottom sheet
   ═══════════════════════════════════════════════════════════════ */

.dt-sheet-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.5);
  backdrop-filter: blur(6px);
  z-index: 1100;
  display: none;
  align-items: flex-end;
  justify-content: center;
  animation: ssFadeIn .2s ease;
}
.dt-sheet-overlay.show { display: flex; }

.dt-sheet {
  background: #fff;
  width: 100%;
  max-width: 560px;
  border-radius: 24px 24px 0 0;
  padding: 8px 20px 24px;
  max-height: 90vh;
  overflow-y: auto;
  animation: ssSlideUp .28s cubic-bezier(.2, .8, .3, 1);
  box-shadow: 0 -10px 40px rgba(15,23,42,.25);
}

.dt-sheet-title {
  font-size: 1.2rem;
  font-weight: 800;
  color: #1a2332;
  letter-spacing: -.025em;
  margin-top: 8px;
  margin-bottom: 4px;
}
.dt-sheet-sub {
  font-size: .82rem;
  color: #8a93a3;
  margin-bottom: 18px;
}

/* Quick presets — 3x2 grid */
.dt-presets {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}
.dt-preset {
  background: #f5f6f9;
  border: 1.5px solid transparent;
  border-radius: 14px;
  padding: 14px 8px;
  text-align: center;
  font-size: .72rem;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
  transition: all .15s;
  line-height: 1.3;
}
.dt-preset b {
  display: block;
  font-size: .92rem;
  font-weight: 800;
  color: #1a2332;
  margin-top: 2px;
  letter-spacing: -.01em;
}
.dt-preset:hover {
  background: #ececf1;
  transform: translateY(-1px);
}
.dt-preset.active {
  background: #1a2332;
  border-color: #1a2332;
  color: rgba(255,255,255,.7);
  box-shadow: 0 4px 14px rgba(15,23,42,.2);
}
.dt-preset.active b {
  color: #fff;
}

/* Divider */
.dt-divider {
  display: flex;
  align-items: center;
  margin: 16px 0 12px;
  gap: 10px;
  color: #8a93a3;
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.dt-divider::before, .dt-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #ececf1;
}

/* Native datetime input */
.dt-input-wrap {
  background: #f5f6f9;
  border-radius: 14px;
  padding: 4px;
  margin-bottom: 16px;
}
.dt-input {
  width: 100%;
  border: none;
  background: #fff;
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 16px;
  font-family: inherit;
  color: #1a2332;
  font-weight: 600;
  -webkit-appearance: none;
}
.dt-input:focus {
  outline: 2px solid #2ea3f2;
  outline-offset: -1px;
}

/* Preview — duża, czytelna data */
.dt-preview {
  background: #1a2332;
  color: #fff;
  border-radius: 16px;
  padding: 18px 20px;
  text-align: center;
  margin-bottom: 18px;
  box-shadow: 0 6px 16px rgba(15,23,42,.18);
}
.dt-preview-day {
  display: block;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: rgba(255,255,255,.6);
  margin-bottom: 4px;
}
.dt-preview-date {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -.02em;
}
.dt-preview-time {
  font-size: 1.15rem;
  font-weight: 800;
  color: #ffd54f;
  margin-left: 6px;
}

/* Actions */
.dt-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.dt-btn-clear, .dt-btn-cancel, .dt-btn-save {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.dt-btn-clear svg, .dt-btn-save svg { width: 17px !important; height: 17px !important; stroke: currentColor; fill: none; flex-shrink: 0; }
.dt-btn-clear {
  flex: 1 1 100%;
  background: #fff;
  border: 1.5px solid #f3c7c0;
  color: #c0392b;
  border-radius: 12px;
  padding: 12px;
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  margin-bottom: 4px;
}
.dt-btn-clear:active { background: #fde8ea; transform: scale(.98); }
.dt-btn-cancel {
  flex: 1;
  background: #f5f6f9;
  border: none;
  border-radius: 12px;
  padding: 14px;
  font-size: .9rem;
  font-weight: 700;
  color: #4b5563;
  cursor: pointer;
}
.dt-btn-cancel:active { background: #ececf1; }
.dt-btn-save {
  flex: 2;
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 14px;
  font-size: .95rem;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: -.01em;
  box-shadow: 0 4px 14px rgba(15,23,42,.22);
  transition: all .15s;
}
.dt-btn-save:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(15,23,42,.28);
}
.dt-btn-save:active { transform: translateY(0); }


/* ── Pipeline filter — PREMIUM segmented control ───────────── */
.crm-pipeline {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 4px !important;
  margin: 16px 0 20px !important;
  padding: 6px !important;
  background: linear-gradient(180deg, #f8f9fc 0%, #f0f2f7 100%) !important;
  border-radius: 18px !important;
  box-shadow:
    inset 0 1px 2px rgba(15,23,42,.04),
    0 1px 0 rgba(255,255,255,.7);
  border: 1px solid rgba(15,23,42,.04) !important;
  overflow-x: auto;
}

.crm-pipe-stage {
  background: transparent !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 10px 4px 8px !important;
  text-align: center;
  cursor: pointer;
  transition: all .25s cubic-bezier(.4,0,.2,1);
  position: relative;
  min-width: 0;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.crm-pipe-emoji {
  font-size: 1.05rem;
  line-height: 1;
  filter: grayscale(.3);
  transition: filter .2s, transform .2s;
}

.crm-pipe-num {
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: #1a2332 !important;
  line-height: 1.1 !important;
  letter-spacing: -.02em;
  font-feature-settings: 'tnum';   /* tabular numbers — równe szerokości */
}

.crm-pipe-label {
  font-size: .58rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  color: #8a93a3 !important;
  margin-top: 1px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* Hover (desktop only) — delikatne podniesienie */
@media (hover: hover) {
  .crm-pipe-stage:not(.active):hover {
    background: rgba(255,255,255,.7) !important;
  }
  .crm-pipe-stage:not(.active):hover .crm-pipe-emoji {
    filter: grayscale(0);
    transform: scale(1.05);
  }
}

/* ── ACTIVE — premium gradient pill ────────────────────── */
.crm-pipe-stage.active {
  background: #1a2332 !important;
  box-shadow:
    0 4px 12px rgba(15,23,42,.22),
    0 1px 3px rgba(15,23,42,.18),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform: translateY(-1px);
}
.crm-pipe-stage.active .crm-pipe-num { color: #fff !important; }
.crm-pipe-stage.active .crm-pipe-label { color: rgba(255,255,255,.7) !important; }
.crm-pipe-stage.active .crm-pipe-emoji {
  filter: grayscale(0);
  transform: scale(1.08);
}

/* Zero counter — subtle */
.crm-pipe-stage:not(.active) .crm-pipe-num { color: #4b5563 !important; }
.crm-pipe-stage:not(.active):has(.crm-pipe-num) {
  /* CSS selector trick: gdy num to "0", przygaś */
}

/* Stage-specific subtle dot indicator on active */
.crm-pipe-stage.active::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  opacity: .5;
}


/* ── LEAD CARD — Apple style z subtelnym borderem (lepiej odcina od białego tła) ── */
.lead-card {
  background: #ffffff;
  color: #1d2a3a;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 1rem;
  padding: 0;
  margin-bottom: 18px;
  cursor: pointer;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .25s ease, border-color .2s;
  box-shadow:
    0 1px 3px rgba(15,23,42,.05),
    0 8px 20px -6px rgba(15,23,42,.08);
  position: relative;
}
.lead-card::before { display: none; }
.lead-card:active { transform: scale(.99); }
.lead-card:hover {
  border-color: rgba(15,23,42,.12);
  box-shadow:
    0 4px 14px -2px rgba(15,23,42,.08),
    0 2px 6px rgba(15,23,42,.04);
}

/* ═══ CRM — lista klientów jako natywna GRUPA iOS (inset grouped list) ═══ */
#crmClientList.crm-grouped {
  background: #ffffff;
  border: 0.5px solid rgba(60,60,67,.10);
  border-radius: 20px;                 /* squircle */
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.05), 0 12px 28px -16px rgba(15,23,42,.12);
}
/* ── WIERSZ KLIENTA — prosty 4-strefowy rząd iOS (ikona / tekst / telefon / chevron) ── */
.crm-grouped .lead-swipe { position: relative; overflow: hidden; }
/* Wcięty separator 0.5px — zaczyna się przy tekście (Strefa 2), pod ikoną czysto */
.crm-grouped .lead-swipe:not(:last-child)::after {
  content: ''; position: absolute; left: 56px; right: 0; bottom: 0;
  height: 0.5px; background: rgba(60,60,67,.13); z-index: 2;
}
.lead-row {
  position: relative; z-index: 1; background: #fff;
  display: flex; align-items: center; gap: 14px;
  padding: 13px 16px; cursor: pointer;
  transition: background .12s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-y; will-change: transform;
}
.lead-row:active { background: #ececf1; }
/* Strefa 1 — naga, monochromatyczna ikona (bez tła) */
.lr-ico { width: 26px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #3a4150; }
.lr-ico svg { width: 23px !important; height: 23px !important; stroke: currentColor; fill: none; stroke-width: 1.6; }
/* Ikona ZAWSZE neutralna — stan niesie kropka */
.lr-urgent .lr-ico { color: #3a4150; }
/* Strefa 2 — stos tekstowy, pcha resztę w prawo */
.lr-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lr-name { font-size: .96rem; font-weight: 600; color: #1d2a3a; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lr-sub { display: flex; align-items: center; gap: 7px; font-size: .8rem; color: #8b94a3; min-width: 0; }
.lr-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ac, #b0b6c0); flex-shrink: 0; }
.lr-sub-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lr-urgent .lr-sub-txt { color: #b04a3f; }
/* Strefa 3 — naga ikona telefonu (bez koła) */
.lr-call { width: 38px; flex-shrink: 0; color: #5a8a1e; display: flex; align-items: center; justify-content: center; background: transparent; text-decoration: none; }
.lr-call svg { width: 22px !important; height: 22px !important; stroke: #5a8a1e !important; fill: none !important; stroke-width: 1.6 !important; }
.lr-call:active { opacity: .55; transform: scale(.9); }
/* Strefa 4 — cienki chevron */
.lr-chev { color: #c4c4cc; flex-shrink: 0; display: flex; align-items: center; }

/* Strip — informacja o ownership (pula / inny ambasador) */
.lead-strip {
  padding: 7px 14px;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.lead-strip {
  font-size: .65rem;
  font-weight: 600;
  padding: 8px 24px;
  letter-spacing: .08em;
}
.lead-strip.pool {
  background: #fefce8;
  color: #854d0e;
  border-bottom: 1px solid #fef3c7;
}
.lead-strip.other {
  background: #f9fafb;
  color: #6b7280;
  border-bottom: 1px solid #f3f4f6;
}

/* Main row: shadcn px-6 py-6 — 24px wszędzie */
.lead-row-main {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
}
/* Awatar — shadcn Avatar: bg-muted, foreground-50% */
.lead-avatar-big {
  width: 46px;
  height: 46px;
  border-radius: 15px;                            /* squircle — spójny język kształtów */
  background: #eef1f5;
  color: #1d2a3a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: .92rem;
  flex-shrink: 0;
  letter-spacing: .01em;
  border: 0;
  box-shadow: none;
}
.lead-main-body { flex: 1; min-width: 0; }
.lead-name-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
/* Tytuł karty — DiBO granat (zamiast czysto czarnego — daje "droższy" feel) */
.lead-name {
  font-size: 1rem;
  font-weight: 600;
  color: #1d2a3a;                                 /* granat DiBO */
  letter-spacing: -.01em;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lead-price {
  font-size: .95rem;
  font-weight: 600;
  color: #1d2a3a;
  white-space: nowrap;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
/* shadcn CardDescription: text-sm text-muted-foreground */
.lead-sub {
  font-size: .875rem;                             /* text-sm */
  font-weight: 400;
  color: hsl(240 3.8% 46.1%);                     /* --muted-foreground */
  margin-top: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}

/* Meta row: czas w etapie + markery */
.lead-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
  align-items: center;
}
/* Czas w etapie — czytelny pill */
.lead-time {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .68rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: var(--r-xs);
  background: #eef2f6;
  color: #475569;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.lead-time.fresh { background: #ecf6da; color: #4d6b0f; }
.lead-time.warm  { background: #fef3c7; color: #b45309; }
.lead-time.stale { background: #fee2e2; color: #b91c1c; }

/* Marker terminu — wyraźny, z ikoną kalendarza */
.lead-marker {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .7rem;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: var(--r-xs);
  background: #eef2f6;
  color: #334155;
  letter-spacing: .02em;
}
.lead-marker svg { width: 13px !important; height: 13px !important; stroke: currentColor; fill: none; }
.lead-marker.scheduled { background: #ecf6da; color: #4d6b0f; }

/* ═══════════════════════════════════════════════════════════════
   KARTA CRM v2 — uproszczona: 1 linia akcji = główna informacja
   ═══════════════════════════════════════════════════════════════ */
.lc-head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 20px 14px;
}
.lc-head-body { flex: 1; min-width: 0; }

/* „Zaległy" badge — tylko gdy lead długo stoi */
.lc-stale {
  flex-shrink: 0;
  align-self: flex-start;
  font-size: .66rem;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 999px;
  background: #fef2f2;
  color: #b91c1c;
  letter-spacing: .02em;
  white-space: nowrap;
}

/* ── 1 LINIA AKCJI — hero karty, mówi CO ZROBIĆ ── */
.lc-action {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 20px 4px;
  padding: 12px 14px;
  border-radius: 11px;
  background: var(--acbg, #eef2f6);
  color: var(--ac, #334155);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.lc-action-ico { display: inline-flex; flex-shrink: 0; }
.lc-action-ico svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
}
.lc-action-txt { min-width: 0; }
.lc-action.urgent {
  box-shadow: inset 0 0 0 1px rgba(185,28,28,.18);
}

/* ── Chipy pomocnicze (termin / przypomnienie) ── */
.lc-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 8px 20px 0;
  padding: 7px 11px;
  border-radius: 9px;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.25;
  max-width: calc(100% - 40px);
}
.lc-chip svg { width: 14px !important; height: 14px !important; stroke: currentColor; fill: none; stroke-width: 1.9; flex-shrink: 0; }
.lc-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lc-chip.termin   { background: #ecf6da; color: #4d6b0f; }
.lc-chip.reminder { background: #eff6ff; color: #1d4ed8; }
.lc-chip.reminder.overdue { background: #fef2f2; color: #b91c1c; }

/* Chevron „otwórz" zamiast ghost-buttona — mniej szumu */
.lc-open {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 34px;
  color: #c4c4cc;            /* cienki, subtelny chevron (sygnał klikalności) */
}
.lc-open svg { width: 16px !important; height: 16px !important; stroke: currentColor; fill: none; stroke-width: 1.6; }

/* Pierwszy chip ma odstęp od linii akcji */
.lc-action + .lc-chip { margin-top: 10px; }

/* ═══════════════════════════════════════════════════════════════
   KARTA CRM v2 (premium) — kropka + tekst zamiast pełnego pasa,
   subtelne linie meta zamiast pełnych pilli. Mniej zieleni, więcej oddechu.
   ═══════════════════════════════════════════════════════════════ */
.lc-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 20px 0;
}
.lc-status-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--ac, #475569);
  flex-shrink: 0;
}
.lc-status-txt {
  font-size: .94rem;
  font-weight: 700;
  color: var(--ac, #334155);
  letter-spacing: -.01em;
  line-height: 1.3;
}
/* Subtelne linie meta (termin / notatka) — ikona + tekst, bez tła */
.lc-meta {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 9px 20px 0;
  font-size: .8rem;
  font-weight: 500;
  color: #64748b;
}
.lc-meta svg { width: 14px !important; height: 14px !important; stroke: #94a3b8; fill: none; stroke-width: 1.8; flex-shrink: 0; }
.lc-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lc-meta.overdue { color: #b91c1c; font-weight: 600; }
.lc-meta.overdue svg { stroke: #b91c1c; }

/* Karta v2 — czystsza ramka, więcej powietrza w stopce */
.lead-card.lc2 .lead-cta-row { padding-top: 16px; margin-top: 16px; }
.lead-card.lc2 .lc-head { padding-bottom: 12px; }

/* ═══════════════════════════════════════════════════════════════
   FILTR „od najważniejszego" — Do zrobienia / Wszystkie
   ═══════════════════════════════════════════════════════════════ */
.crm-prio {
  display: flex;
  gap: 8px;
  margin: 0 0 14px;
}

/* Opis listy CRM — co to jest / jak czytać karty */
.crm-list-hint {
  font-size: .78rem;
  line-height: 1.5;
  color: #6b7280;
  padding: 0 2px 12px;
}
.crm-list-hint svg {
  width: 13px !important; height: 13px !important;
  stroke: #94a3b8; fill: none; vertical-align: -2px; margin: 0 1px;
}
.crm-prio-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 15px;
  border-radius: 999px;
  border: 1px solid hsl(240 5.9% 90%);
  background: #ffffff;
  color: #64748b;
  font-size: .84rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: -.01em;
  transition: all .16s;
  -webkit-tap-highlight-color: transparent;
}
.crm-prio-btn svg { width: 15px !important; height: 15px !important; stroke: currentColor; fill: none; stroke-width: 1.9; }
.crm-prio-btn:active { transform: scale(.97); }
.crm-prio-btn.active {
  background: #1d2a3a;
  border-color: #1d2a3a;
  color: #ffffff;
  box-shadow: 0 2px 8px -2px rgba(29,42,58,.4);
}
.crm-prio-btn.active svg { stroke: #95c11f; }   /* zielony akcent na aktywnym */

/* Pusty stan „Do zrobienia" — nic pilnego */
.crm-todo-empty {
  text-align: center;
  padding: 36px 20px;
  background: #ffffff;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 1rem;
}
.crm-todo-empty .cte-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(149,193,31,.14); color: #5a8a1e;
  margin-bottom: 12px;
}
.crm-todo-empty .cte-ico svg { width: 26px !important; height: 26px !important; stroke: currentColor; fill: none; stroke-width: 2; }
.crm-todo-empty .cte-title { font-size: 1rem; font-weight: 700; color: #1d2a3a; }
.crm-todo-empty .cte-sub { font-size: .85rem; color: #64748b; margin-top: 4px; }
.crm-todo-empty .cte-btn {
  margin-top: 16px;
  padding: 10px 20px;
  border-radius: 10px;
  border: 1px solid hsl(240 5.9% 90%);
  background: #ffffff;
  color: #1d2a3a;
  font-size: .85rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: all .16s;
}
.crm-todo-empty .cte-btn:hover { border-color: #95c11f; color: #5a8a1e; }
.crm-todo-empty .cte-btn:active { transform: scale(.97); }

/* CTA row: shadcn CardFooter — pt-6 px-6 pb-6 z border-top */
.lead-cta-row {
  display: flex;
  gap: 8px;
  padding: 16px 24px 20px;
  border-top: 1px solid hsl(240 5.9% 90%);
  margin-top: 0;
}
.lead-call-btn {
  flex-shrink: 0;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  color: #1d2a3a;
  border-radius: var(--r-sm);
  padding: var(--p-btn);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all .18s;
  letter-spacing: -.005em;
}
.lead-call-btn svg {
  width: 16px !important;
  height: 16px !important;
  stroke: #6b7280;
  fill: none;
  stroke-width: 1.7;
  flex-shrink: 0;
  transition: stroke .15s;
}
.lead-call-btn:active { transform: scale(.97); }
.lead-call-btn:hover {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #1d2a3a;
}
.lead-call-btn:hover svg { stroke: #95c11f; }

/* Map button — minimalistyczna ikona bez border (jak iOS) */
.lead-map-btn {
  flex-shrink: 0;
  background: transparent;
  border: 0;
  color: #6b7280;
  border-radius: var(--r-sm);
  padding: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all .15s;
}
.lead-map-btn svg { width: 16px !important; height: 16px !important; stroke: #6b7280; fill: none; stroke-width: 1.7; }
.lead-map-btn:hover svg { stroke: #95c11f; }
.lead-map-btn:active { transform: scale(.92); }
.lead-map-btn:hover { background: rgba(149,193,31,.08); }
.lead-primary-btn {
  flex: 1;
  background: #95c11f;
  color: #1d2a3a;
  border: none;
  border-radius: var(--r-sm);
  padding: var(--p-btn);
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  letter-spacing: -.005em;
  transition: all .18s;
  box-shadow: 0 2px 6px rgba(149,193,31,.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: inherit;
}
.lead-primary-btn svg { width: 14px !important; height: 14px !important; stroke: #1d2a3a; fill: none; stroke-width: 1.8; }
.lead-primary-btn:active { transform: scale(.97); }
.lead-primary-btn:hover {
  box-shadow: 0 4px 12px rgba(149,193,31,.45);
  transform: translateY(-1px);
}
.lead-primary-btn.ghost {
  background: #ffffff;
  color: #6b7280;
  border: 1px solid #e5e7eb;
  box-shadow: none;
  font-weight: 500;
}
.lead-primary-btn.ghost svg { stroke: #6b7280; fill: none; }
.lead-primary-btn.ghost:hover {
  background: #f8faf5;
  border-color: #95c11f;
  color: #5a8a1e;
}
.lead-primary-btn.ghost:active { background: #ecfccb; }

/* Stage accent: ultra-subtle 2px lewy pasek per etap */
.lead-card.card-stage-pool       { border-left: 2px solid #e5e7eb; }
.lead-card.card-stage-to_call    { border-left: 2px solid #e5e7eb; }
.lead-card.card-stage-quoted     { border-left: 2px solid #e5e7eb; }
.lead-card.card-stage-measured   { border-left: 2px solid #e5e7eb; }
.lead-card.card-stage-to_schedule{ border-left: 2px solid #95c11f; }
.lead-card.card-stage-scheduled  { border-left: 3px solid #95c11f; }
.lead-card.card-stage-won        { border-left: 3px solid #1b7a35; }
.lead-card.card-stage-lost       { border-left: 3px solid #cbd5e1; opacity: .65; }

/* AKCEPTACJA wygrywa wszystko — wymaża stage border żeby zielony border się nie kłócił */
.lead-card.lead-accepted.card-stage-pool,
.lead-card.lead-accepted.card-stage-to_call,
.lead-card.lead-accepted.card-stage-quoted,
.lead-card.lead-accepted.card-stage-measured,
.lead-card.lead-accepted.card-stage-to_schedule,
.lead-card.lead-accepted.card-stage-scheduled,
.lead-card.lead-accepted.card-stage-won,
.lead-card.lead-accepted.card-stage-lost {
  border-left: 2px solid #95c11f;
}

/* ── Karta v2: bez kolorowych pasków z lewej — kolor niesie KROPKA statusu ── */
.lead-card.lc2.card-stage-pool,
.lead-card.lc2.card-stage-to_call,
.lead-card.lc2.card-stage-quoted,
.lead-card.lc2.card-stage-measured,
.lead-card.lc2.card-stage-to_schedule,
.lead-card.lc2.card-stage-scheduled,
.lead-card.lc2.card-stage-won,
.lead-card.lc2.lead-accepted.card-stage-pool,
.lead-card.lc2.lead-accepted.card-stage-to_call,
.lead-card.lc2.lead-accepted.card-stage-quoted,
.lead-card.lc2.lead-accepted.card-stage-measured,
.lead-card.lc2.lead-accepted.card-stage-to_schedule,
.lead-card.lc2.lead-accepted.card-stage-scheduled {
  border-left: 1px solid rgba(15,23,42,.07);
}
.lead-card.lc2.card-stage-lost { border-left: 1px solid rgba(15,23,42,.07); opacity: .6; }
.lead-card.lc2.lead-urgent { border-left: 3px solid #e30613; }


/* Hide old crm-card classes (legacy) */
.crm-card.crm-card-clean { display: none; }

.cal-grid-legend {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  padding: 10px 14px;
  background: var(--neutral-50, #f5f6f9);
  border-radius: 10px;
  font-size: .75rem;
  color: var(--ink-2, #4b5563);
}
.cal-legend-item { display: inline-flex; align-items: center; gap: 6px; }
.cal-legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

.cal-gcal-info {
  background: #e3f2fd;
  border: 1px solid #90caf9;
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 12px;
  font-size: .76rem;
  color: #1e40af;
  line-height: 1.5;
}

.cal-info-banner {
  background: #f5f6f9;
  border-left: 3px solid #1565c0;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: .76rem;
  color: #1e40af;
  line-height: 1.5;
  margin-bottom: 12px;
}

/* Tab "Google" jako link otwierający w nowej karcie */
.cal-view-btn[href] {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

/* Launcher do Google Calendar (działa wszędzie, też mobile) */
.cal-gcal-launcher {
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 18px;
  padding: 24px 20px;
  text-align: center;
  margin-bottom: 14px;
  box-shadow: 0 4px 16px rgba(15,23,42,.06);
}
.cal-gcal-launcher-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: #e8f0fe;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}
.cal-gcal-launcher-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--ink, #1a2332);
  margin-bottom: 8px;
  letter-spacing: -.01em;
}
.cal-gcal-launcher-desc {
  font-size: .85rem;
  color: var(--ink-2, #4b5563);
  line-height: 1.55;
  margin-bottom: 18px;
}
.cal-gcal-launcher-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--ink, #1a2332);
  color: #fff !important;
  text-decoration: none;
  padding: 13px 22px;
  border-radius: 14px;
  font-weight: 800;
  font-size: .92rem;
  box-shadow: 0 4px 14px rgba(15,23,42,.2);
  transition: transform .1s;
}
.cal-gcal-launcher-btn:active { transform: scale(.97); }
.cal-gcal-launcher-hint {
  margin-top: 14px;
  font-size: .72rem;
  color: var(--ink-3, #8a93a3);
  line-height: 1.45;
}

.cal-gcal-embed-details {
  background: var(--neutral-50, #f5f6f9);
  border-radius: 12px;
  padding: 12px;
}
.cal-gcal-embed-details summary {
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  color: var(--ink-2, #4b5563);
  list-style: none;
  user-select: none;
}
.cal-gcal-embed-details summary::-webkit-details-marker { display: none; }
.cal-gcal-embed-details summary::before {
  content: '▸ ';
  display: inline-block;
}
.cal-gcal-embed-details[open] summary::before { content: '▾ '; }


/* ═══════════════════════════════════════════════════════════════
   FAZA 4 — Lead Detail Modal (3 zakładki)
   ═══════════════════════════════════════════════════════════════ */

.ld-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.ld-name {
  font-weight: 900;
  font-size: 1.15rem;
  color: var(--ink, #1a2332);
  letter-spacing: -.02em;
  margin-bottom: 4px;
  line-height: 1.2;
}
.ld-phone-btn {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--ink, #1a2332);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  text-decoration: none;
}
.ld-phone-btn:active { transform: scale(.94); }

.ld-claim-btn {
  width: 100%;
  background: linear-gradient(135deg, #2ea3f2, #1a73e8);
  color: #fff;
  border: none;
  border-radius: 14px;
  padding: 14px;
  font-size: .92rem;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
  box-shadow: 0 6px 20px rgba(46,163,242,.28);
}
.ld-claim-btn:active { transform: scale(.97); }

/* Tabs — premium iOS segmented control */
.ld-tabs {
  display: flex;
  background: linear-gradient(180deg, #f0f2f7 0%, #e8ebf2 100%);
  border-radius: 14px;
  padding: 4px;
  margin: 0 0 18px;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.04);
}
.ld-tab {
  flex: 1;
  padding: 10px 12px;
  border: none;
  background: transparent;
  font-size: .85rem;
  font-weight: 700;
  color: #4b5563;
  cursor: pointer;
  border-radius: 11px;
  transition: all .2s cubic-bezier(.4,0,.2,1);
  letter-spacing: -.005em;
}
.ld-tab:hover:not(.active) { color: #1a2332; }
.ld-tab.active {
  background: #fff;
  color: #1a2332;
  box-shadow:
    0 1px 1px rgba(15,23,42,.04),
    0 3px 8px rgba(15,23,42,.08);
  transform: translateY(-1px);
}
.ld-tab-content { min-height: 200px; }

/* Polish stage banner SVG icon container */
.ld-stage-banner-icon svg {
  display: block;
}

/* Pipeline dots — premium */
.crm-pipeline-dots {
  margin: 14px 0 14px;
  padding: 0 8px;
}
.crm-pipeline-dots .crm-pipe-step {
  transition: transform .15s;
}
.crm-pipeline-dots .crm-pipe-step:hover .crm-pipe-dot {
  transform: scale(1.25);
}
.crm-pipeline-dots .crm-pipe-step.current .crm-pipe-dot {
  background: #1a2332 !important;
  border-color: #1a2332 !important;
  box-shadow: 0 0 0 4px rgba(26,35,50,.18) !important;
}
.crm-pipeline-dots .crm-pipe-step.done .crm-pipe-dot {
  background: #22c55e !important;
  border-color: #22c55e !important;
}
.crm-pipeline-dots .crm-pipe-step.current .crm-pipe-step-label {
  color: #1a2332;
  font-weight: 800;
}
.crm-pipeline-dots .crm-pipe-step.done .crm-pipe-step-label {
  color: #22c55e;
}

/* Sections */
.ld-section { margin-bottom: 14px; }
.ld-label {
  display: block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--ink-3, #8a93a3);
  margin-bottom: 8px;
}
.ld-sublabel {
  font-size: .68rem;
  font-weight: 600;
  color: var(--ink-3, #8a93a3);
  margin-bottom: 4px;
}
.ld-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.ld-meta-footer {
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid var(--border, #ececf1);
  font-size: .7rem;
  color: var(--ink-3, #8a93a3);
  line-height: 1.6;
}

/* History items */
.ld-hist-item {
  display: flex;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-soft, #f1f2f6);
}
.ld-hist-item:last-child { border-bottom: none; }
.ld-hist-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink, #1a2332);
  margin-top: 7px;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px var(--neutral-50, #f5f6f9);
}
.ld-hist-body { flex: 1; min-width: 0; }
.ld-hist-action {
  font-size: .85rem;
  font-weight: 700;
  color: var(--ink, #1a2332);
}
.ld-hist-detail {
  font-size: .78rem;
  color: var(--ink-2, #4b5563);
  margin-top: 2px;
}
.ld-hist-meta {
  font-size: .68rem;
  color: var(--ink-3, #8a93a3);
  margin-top: 3px;
}

/* Messages composer + list */
.ld-msg-composer {
  background: var(--neutral-50, #f5f6f9);
  border: 1px solid var(--border, #ececf1);
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 16px;
}
.ld-msg-item {
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 8px;
}
.ld-msg-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  font-size: .72rem;
}
.ld-msg-icon { font-size: .95rem; }
.ld-msg-channel {
  text-transform: uppercase;
  font-weight: 700;
  color: var(--ink, #1a2332);
  letter-spacing: .04em;
  font-size: .65rem;
}
.ld-msg-meta {
  margin-left: auto;
  color: var(--ink-3, #8a93a3);
  font-size: .65rem;
}
.ld-msg-body {
  font-size: .85rem;
  color: var(--ink, #1a2332);
  white-space: pre-wrap;
  line-height: 1.5;
}

/* Owner-tag w karcie lead (do listy) */
.crm-card-owner-tag {
  margin-left: 8px;
  font-size: .62rem;
  font-weight: 700;
  background: var(--neutral-100, #eef0f5);
  color: var(--ink-2, #4b5563);
  padding: 2px 7px;
  border-radius: 6px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.crm-card-owner-tag.pool-tag {
  background: #fef3c7;
  color: #92400e;
}


/* ── Stage banner (duża informacja o etapie) ─────────────── */
.ld-stage-banner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--border, #ececf1);
  border-left: 4px solid var(--ink, #1a2332);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 14px;
}
.ld-stage-banner-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  flex-shrink: 0;
}
.ld-stage-banner-text { flex: 1; min-width: 0; }
.ld-stage-banner-title {
  font-weight: 800;
  font-size: 1rem;
  color: var(--ink, #1a2332);
  letter-spacing: -.01em;
  line-height: 1.2;
}
.ld-stage-banner-desc {
  font-size: .76rem;
  color: var(--ink-2, #4b5563);
  margin-top: 3px;
  line-height: 1.45;
}
.ld-stage-banner-meta {
  display: inline-block;
  margin-top: 6px;
  font-size: .75rem;
  font-weight: 700;
  color: var(--ink, #1a2332);
  background: var(--neutral-50, #f5f6f9);
  padding: 4px 10px;
  border-radius: 8px;
}


/* ── Action bar (etap-specific CTAs) ─────────────────────── */
.ld-action-bar {
  margin: 14px 0 16px;
}
.ld-action-bar-label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--ink-3, #8a93a3);
  margin-bottom: 8px;
  padding-left: 2px;
}
.ld-action-primary {
  width: 100%;
  background: #1a2332;
  color: #fff;
  border: none;
  border-radius: 16px;
  padding: 16px 18px;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.02em;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-shadow:
    0 6px 16px rgba(15,23,42,.2),
    0 2px 4px rgba(15,23,42,.1),
    inset 0 1px 0 rgba(255,255,255,.06);
  transition: all .15s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
  font-family: inherit;
}
.ld-action-primary svg { width: 20px !important; height: 20px !important; stroke: currentColor; fill: none; stroke-width: 1.8; flex-shrink: 0; }
.ld-action-primary:hover {
  transform: translateY(-1px);
  box-shadow:
    0 10px 20px rgba(15,23,42,.25),
    0 3px 6px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.08);
}
.ld-action-primary:active { transform: translateY(0); }

/* Wariant telefoniczny primary — zieleń (kluczowe CTA „Zadzwoń"), 1 na ekran */
.ld-action-call {
  background: #95c11f;
  color: #1d2a3a;
  justify-content: flex-start;
  text-decoration: none;
  gap: 12px;
  box-shadow: 0 6px 16px rgba(149,193,31,.30), inset 0 1px 0 rgba(255,255,255,.2);
}
.ld-action-call .ld-ac-ico {
  width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
  background: rgba(29,42,58,.12);
  display: flex; align-items: center; justify-content: center;
}
.ld-action-call .ld-ac-ico svg { width: 20px !important; height: 20px !important; stroke: #1d2a3a; fill: none; }
.ld-action-call .ld-ac-txt { display: flex; flex-direction: column; align-items: flex-start; flex: 1; min-width: 0; }
.ld-action-call .ld-ac-title { font-size: .98rem; font-weight: 800; line-height: 1.15; }
.ld-action-call .ld-ac-sub { font-size: .82rem; font-weight: 600; opacity: .72; font-variant-numeric: tabular-nums; }
.ld-action-call .ld-ac-arrow { flex-shrink: 0; display: inline-flex; }
.ld-action-call .ld-ac-arrow svg { width: 18px !important; height: 18px !important; stroke: #1d2a3a; fill: none; opacity: .55; }

.ld-action-row {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.ld-action-secondary {
  flex: 1;
  background: #fff;
  color: var(--ink, #1a2332);
  border: 1px solid var(--border, #ececf1);
  border-radius: 12px;
  padding: 10px 8px;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, transform .1s;
  text-align: center;
}
.ld-action-secondary:active { background: var(--neutral-50, #f5f6f9); transform: scale(.97); }
.ld-action-secondary.danger {
  color: #c0392b;
  border-color: #f3c7c0;
}
.ld-action-secondary.danger:active { background: #fde8ea; }

.ld-action-info {
  background: var(--neutral-50, #f5f6f9);
  border: 1px solid var(--border, #ececf1);
  border-radius: 12px;
  padding: 14px;
  font-size: .85rem;
  color: var(--ink-2, #4b5563);
  text-align: center;
}


/* ── Ownership badge na karcie leada (lista) ───────────── */
.ownership-badge {
  display: inline-block;
  font-size: .58rem;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: .05em;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.ownership-badge.mine {
  background: #d1fae5;
  color: #047857;
  border: 1px solid #6ee7b7;
}
.ownership-badge.pool {
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fbbf24;
}
.ownership-badge.other {
  background: #f1f2f6;
  color: #4b5563;
  border: 1px solid #d1d5db;
}

/* Karta leada — różne tło zależnie od ownership */
.crm-card.is-mine {
  background: linear-gradient(180deg, #f0fdf4 0%, #fff 30%);
  border-color: #a7f3d0 !important;
}
.crm-card.is-pool {
  background: linear-gradient(180deg, #fffbeb 0%, #fff 30%);
  border-color: #fcd34d !important;
}
.crm-card.is-other {
  background: #fafbfc;
  border-color: #e5e7eb !important;
}

/* Quote sent icon on card */
.crm-card-quote-sent {
  font-size: .85rem;
  margin-left: auto;
  padding: 2px 6px;
  background: #d1fae5;
  border-radius: 6px;
  border: 1px solid #6ee7b7;
}

/* "Co zrobione" ikony w karcie leada */
.crm-done-icons {
  margin-left: auto;
  display: inline-flex;
  gap: 3px;
}
.crm-done-icon {
  font-size: .75rem;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--neutral-50, #f5f6f9);
  border-radius: 6px;
  border: 1px solid var(--border-soft, #e3e6ee);
  cursor: help;
}
.crm-done-icon.quote { background: #d1fae5; border-color: #6ee7b7; }
.crm-done-icon.gcal  { background: #e3f2fd; border-color: #bfdbfe; }
.crm-done-icon.win   { background: #fef3c7; border-color: #fbbf24; }


/* ── Checklist w stage banner ────────────────────────────── */
.ld-stage-banner-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.ld-checklist {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--border, #ececf1);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ld-check-item {
  font-size: .76rem;
  line-height: 1.4;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--neutral-50, #f5f6f9);
  color: var(--ink-2, #4b5563);
  display: flex;
  align-items: center;
  gap: 6px;
}
.ld-check-item svg { width: 14px !important; height: 14px !important; stroke: currentColor; fill: none; stroke-width: 1.8; flex-shrink: 0; }
.ld-check-item.done {
  background: #d1fae5;
  color: #065f46;
}
.ld-check-item.done b { color: #047857; font-weight: 700; }
.ld-check-item.done.quote {
  background: #dbeafe;
  color: #1e40af;
}
.ld-check-item.done.quote b { color: #1e3a8a; }
.ld-check-item.done.win {
  background: #fef3c7;
  color: #78350f;
}
.ld-check-item.done.lost {
  background: #fde8ea;
  color: #991b1b;
}
.ld-check-item.pending {
  background: #fef3c7;
  color: #92400e;
  font-weight: 600;
  border-left: 3px solid #f59e0b;
}

/* Quote status meta in banner */
.ld-stage-banner-meta.quote-sent {
  background: #d1fae5;
  color: #047857;
  border: 1px solid #6ee7b7;
}
.ld-stage-banner-meta.quote-pending {
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fbbf24;
}


/* ═══════════════════════════════════════════════════════════════
   QUOTE COMPOSER MODAL
   ═══════════════════════════════════════════════════════════════ */

.qc-warn-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fef3c7;
  border: 1px solid #fbbf24;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 14px;
}
.qc-warn-icon { font-size: 1.5rem; }
.qc-warn-text { flex: 1; min-width: 0; }
.qc-warn-title {
  font-size: .85rem;
  font-weight: 800;
  color: #92400e;
}
.qc-warn-sub {
  font-size: .72rem;
  color: #78350f;
  margin-top: 2px;
}

.qc-helper {
  font-size: .7rem;
  color: #8a93a3;
  margin-top: 4px;
}

.qc-preview-details {
  background: #f5f6f9;
  border-radius: 10px;
  padding: 10px;
  margin: 10px 0;
}
.qc-preview-details summary {
  font-size: .8rem;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  color: #4b5563;
}
.qc-preview-details summary::-webkit-details-marker { display: none; }
.qc-preview {
  margin-top: 10px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 8px;
  max-height: 280px;
  overflow-y: auto;
}

.qc-status {
  padding: 10px 12px;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 700;
  margin-top: 10px;
  text-align: center;
}
.qc-status.info { background: #e3f2fd; color: #1976d2; }
.qc-status.success { background: #d1fae5; color: #047857; }
.qc-status.error { background: #fde8ea; color: #c0392b; }


/* ── Ownership banner w modal (na górze) ────────────────── */
.ld-ownership-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  margin-bottom: 14px;
  border: 1px solid transparent;
}
.ld-ownership-banner.mine {
  background: #d1fae5;
  border-color: #6ee7b7;
}
.ld-ownership-banner.pool {
  background: #fef3c7;
  border-color: #fbbf24;
}
.ld-ownership-banner.other {
  background: #f1f2f6;
  border-color: #d1d5db;
}
.ld-ownership-icon {
  font-size: 1.4rem;
  flex-shrink: 0;
}
.ld-ownership-text { flex: 1; min-width: 0; }
.ld-ownership-title {
  font-size: .85rem;
  font-weight: 800;
  letter-spacing: .02em;
  color: #1a2332;
}
.ld-ownership-banner.mine .ld-ownership-title { color: #047857; }
.ld-ownership-banner.pool .ld-ownership-title { color: #92400e; }
.ld-ownership-sub {
  font-size: .7rem;
  color: #4b5563;
  margin-top: 2px;
}


/* ── Stage Navigation (cofnij / aktualny / naprzód) ─────── */
.ld-stage-nav {
  display: grid;
  grid-template-columns: 1fr 1.6fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.ld-stage-nav-btn {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 8px;
  font-size: .72rem;
  font-weight: 700;
  color: #4b5563;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  transition: background .15s, transform .1s, border-color .15s;
}
.ld-stage-nav-btn:active { transform: scale(.96); background: #f5f6f9; }
.ld-stage-nav-btn.back { color: #4b5563; }
.ld-stage-nav-btn.fwd {
  color: #fff;
  background: #1a2332;
  border-color: #1a2332;
}
.ld-stage-nav-btn.fwd:active { background: #0f172a; }
.ld-stage-nav-btn.empty {
  visibility: hidden;
  pointer-events: none;
}
.ld-stage-nav-current {
  background: #f5f6f9;
  border-radius: 12px;
  padding: 8px 8px 6px;
  text-align: center;
  border: 1px solid #e5e7eb;
}
.ld-stage-nav-cur-num {
  font-size: .58rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-weight: 700;
  color: #8a93a3;
}
.ld-stage-nav-cur-label {
  font-size: .82rem;
  font-weight: 800;
  color: #1a2332;
  margin-top: 1px;
}

/* Pipeline dots — klikalne */
.crm-pipeline-dots .crm-pipe-step:hover .crm-pipe-dot {
  transform: scale(1.2);
}
.crm-pipeline-dots .crm-pipe-step .crm-pipe-dot {
  transition: transform .15s;
}


/* ── Advanced details (zawijane menu zmiany etapu ręcznie) ── */
.ld-advanced {
  margin: 16px 0;
  background: var(--neutral-50, #f5f6f9);
  border: 1px solid var(--border, #ececf1);
  border-radius: 12px;
  padding: 0;
}
.ld-advanced > summary {
  padding: 12px 14px;
  font-size: .8rem;
  font-weight: 700;
  color: var(--ink-3, #8a93a3);
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.ld-advanced > summary::-webkit-details-marker { display: none; }
.ld-advanced > summary::before {
  content: '▸ ';
  display: inline-block;
  transition: transform .15s;
}
.ld-advanced[open] > summary::before { content: '▾ '; }
.ld-advanced > *:not(summary) {
  padding: 0 14px;
}
.ld-advanced > *:last-child {
  padding-bottom: 14px;
}

.ai-spinner {
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 2px solid rgba(255,255,255,.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: aiSpin .7s linear infinite;
  margin-right: 8px;
  vertical-align: -1px;
}
@keyframes aiSpin {
  to { transform: rotate(360deg); }
}
.ai-tech-btn:disabled {
  opacity: .8;
  cursor: wait;
}

/* Przyciski outline — premium: granatowy tekst, subtelna ramka, zielony akcent na hover */
.btn-outline {
  border: 1px solid hsl(240 5.9% 86%) !important;
  color: #1d2a3a !important;
}
.btn-outline:hover { border-color: var(--accent) !important; color: #5a8a1e !important; }

/* Status pills w lead card (.crm-next-action) — subtelny kolor zależnie od stanu */
.crm-card-bar { width: 4px !important; }

/* ═══════════════════════════════════════════════════════════════
   PREMIUM CHECKOUT — subskrypcja (owner-beta). Granat + zieleń, jak Apple Pay sheet.
   ═══════════════════════════════════════════════════════════════ */
.checkout-overlay {
  position: fixed; inset: 0; z-index: 100002;
  background: #131b26;
  display: none; flex-direction: column; align-items: center;
  padding: max(28px, env(safe-area-inset-top, 0px)) 24px max(24px, env(safe-area-inset-bottom, 0px));
  animation: coFade .3s ease;
}
.checkout-overlay.show { display: flex; }
@keyframes coFade { from { opacity: 0; } to { opacity: 1; } }
.co-close {
  position: absolute; top: max(20px, env(safe-area-inset-top, 0px)); left: 20px;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.85); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  -webkit-tap-highlight-color: transparent;
}
.co-close svg { width: 20px !important; height: 20px !important; fill: none; stroke: currentColor; }
.co-stage {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 20px; width: 100%; max-width: 460px;
}
.co-badge-wrap {
  width: 168px; height: 168px; border-radius: 42px;
  background: rgba(149,193,31,.08); border: 1px solid rgba(149,193,31,.14);
  display: flex; align-items: center; justify-content: center;
}
.co-badge { width: 112px; height: 112px; object-fit: contain; }
.co-plan-tag { font-size: .72rem; font-weight: 800; letter-spacing: .2em; color: #95c11f; }
.co-info { width: 100%; max-width: 460px; text-align: center; }
.co-name { font-size: 1.7rem; font-weight: 800; color: #fff; letter-spacing: -.02em; }
.co-sub { font-size: .9rem; color: rgba(255,255,255,.5); margin-top: 6px; }
.co-price { margin-top: 18px; display: flex; align-items: baseline; justify-content: center; gap: 8px; }
.co-amount { font-size: 3.2rem; font-weight: 900; color: #fff; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.co-cur { font-size: 1rem; font-weight: 600; color: rgba(255,255,255,.45); }
.co-feats { margin: 18px auto 0; display: flex; flex-direction: column; gap: 9px; align-items: flex-start; max-width: 300px; }
.co-feat { display: flex; align-items: center; gap: 10px; font-size: .85rem; color: rgba(255,255,255,.82); }
.co-feat svg { width: 16px !important; height: 16px !important; stroke: #95c11f; fill: none; flex-shrink: 0; }
.co-paybar { width: 100%; max-width: 460px; }
.co-pay {
  width: 100%; padding: 18px; border: none; border-radius: 18px;
  background: #95c11f; color: #1d2a3a;
  font-size: 1.05rem; font-weight: 800; letter-spacing: .03em;
  cursor: pointer; font-family: inherit;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  box-shadow: 0 12px 32px -8px rgba(149,193,31,.55);
  transition: transform .12s, background .15s;
}
.co-pay svg { width: 19px !important; height: 19px !important; stroke: #1d2a3a; fill: none; }
.co-pay b { font-weight: 900; }
.co-pay:active { transform: scale(.98); background: #88b31c; }
.co-secure { text-align: center; font-size: .74rem; color: rgba(255,255,255,.4); margin-top: 12px; }

/* Animacja wejścia — jak na gifie: elementy wjeżdżają, pasek płatności wsuwa się od dołu */
.checkout-overlay.show .co-stage   { animation: coRise .55s cubic-bezier(.22,1,.36,1) both; }
.checkout-overlay.show .co-info    { animation: coRise .55s cubic-bezier(.22,1,.36,1) .08s both; }
.checkout-overlay.show .co-paybar  { animation: coSlideUp .6s cubic-bezier(.22,1,.36,1) .16s both; }
.checkout-overlay.show .co-close   { animation: coFade .4s ease .2s both; }
@keyframes coRise    { from { opacity: 0; transform: translateY(18px) scale(.965); } to { opacity: 1; transform: none; } }
@keyframes coSlideUp { from { opacity: 0; transform: translateY(44px); } to { opacity: 1; transform: none; } }
/* Badge delikatnie „oddycha", przycisk ZAPŁAĆ subtelnie pulsuje (przyciąga wzrok) */
.checkout-overlay.show .co-badge-wrap { animation: coRise .55s cubic-bezier(.22,1,.36,1) both, coFloat 5s ease-in-out 1s infinite; }
@keyframes coFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -7px; } }
.co-pay { animation: coPulse 2.6s ease-in-out 1s infinite; }
@keyframes coPulse {
  0%,100% { box-shadow: 0 12px 32px -8px rgba(149,193,31,.55); }
  50%     { box-shadow: 0 14px 40px -6px rgba(149,193,31,.75); }
}
.co-pay:active { animation: none; }

/* Warstwa wyniku płatności — spinner → animowany checkmark */
.co-result {
  position: absolute; inset: 0; z-index: 5;
  background: #131b26;
  display: none; flex-direction: column; align-items: center; justify-content: center;
  gap: 22px; padding: 24px; text-align: center;
  animation: coFade .25s ease;
}
.co-result.show { display: flex; }
.co-spinner {
  width: 62px; height: 62px; border-radius: 50%;
  border: 4px solid rgba(255,255,255,.12); border-top-color: #95c11f;
  animation: coSpin .8s linear infinite;
}
@keyframes coSpin { to { transform: rotate(360deg); } }
.co-success { display: none; }
.co-success.show { display: block; animation: coPop .45s cubic-bezier(.22,1.4,.36,1) both; }
@keyframes coPop { from { transform: scale(.55); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.co-check { width: 92px; height: 92px; }
.co-check-circle {
  stroke: #95c11f; stroke-width: 3;
  stroke-dasharray: 151; stroke-dashoffset: 151;
  animation: coDraw .5s cubic-bezier(.65,0,.45,1) forwards;
}
.co-check-mark {
  stroke: #95c11f; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 48; stroke-dashoffset: 48;
  animation: coDraw .35s cubic-bezier(.65,0,.45,1) .45s forwards;
}
@keyframes coDraw { to { stroke-dashoffset: 0; } }
.co-result-text { font-size: 1.2rem; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.co-result-sub { font-size: .85rem; color: rgba(255,255,255,.5); margin-top: -12px; }

/* „Karta wsuwa się do telefonu" — elegancki zjazd w dół po tapnięciu ZAPŁAĆ */
@keyframes coIntoPhone {
  0%   { transform: translateY(0) scale(1); opacity: 1; }
  16%  { transform: translateY(-12px) scale(1.012); }
  100% { transform: translateY(112vh) scale(.72); opacity: 0; }
}
.checkout-overlay.paying .co-stage  { animation: coIntoPhone .9s cubic-bezier(.6,0,.32,1) forwards; }
.checkout-overlay.paying .co-info   { animation: coIntoPhone .9s cubic-bezier(.6,0,.32,1) .05s forwards; }
.checkout-overlay.paying .co-paybar { animation: coIntoPhone .9s cubic-bezier(.6,0,.32,1) .1s forwards; }
.checkout-overlay.paying .co-pay    { animation: none; }
.checkout-overlay.paying .co-close  { opacity: 0; pointer-events: none; transition: opacity .2s; }

/* ── SCENA PŁATNOŚCI — karta wsuwa się do czytnika (terminal) ── */
.co-scene {
  position: absolute; inset: 0; z-index: 6;
  background: #131b26;
  display: none; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px; animation: coFade .25s ease;
}
.co-scene.show { display: flex; }
/* Scena: stos czytnik (przód) + karta (za nim) — sterowana geometria */
.co-stack { position: relative; width: 256px; height: 160px; }
/* Czytnik — ekran (gradient, kwota, ikona, status) jak w referencji */
.co-reader {
  width: 256px; height: 160px; border-radius: 24px;
  background: linear-gradient(180deg, #3f86ec 0%, #1b4aa6 100%);
  position: absolute; left: 0; top: 0; z-index: 2; overflow: hidden;
  box-shadow: 0 26px 54px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.22);
}
.co-reader::before {
  content: ''; position: absolute; top: -40%; left: 50%; transform: translateX(-50%);
  width: 130%; height: 90%;
  background: radial-gradient(ellipse at center, rgba(255,255,255,.28), transparent 60%);
  pointer-events: none;
}
.co-reader-amount {
  position: absolute; top: 16px; left: 18px; z-index: 1;
  font-size: 1.5rem; font-weight: 800; color: #fff; letter-spacing: -.02em;
}
.co-reader-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -56%); }
.co-reader-icon svg { width: 52px !important; height: 52px !important; stroke: rgba(255,255,255,.92); fill: none; }
.co-reader-status {
  position: absolute; bottom: 15px; left: 0; right: 0; z-index: 1;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  color: rgba(255,255,255,.92); font-size: .82rem; font-weight: 600;
}
.co-reader-dots { display: flex; gap: 5px; }
.co-reader-dots i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: coBlink 1s infinite ease-in-out; }
.co-reader-dots i:nth-child(2) { animation-delay: .15s; }
.co-reader-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes coBlink { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
.co-reader-check { width: 20px !important; height: 20px !important; stroke: #fff; fill: none; display: none; animation: coPop .4s cubic-bezier(.22,1.4,.36,1) both; }
.co-scene-text { font-size: .82rem; font-weight: 600; }

/* Realistyczna karta płatnicza */
.co-cardv {
  width: 224px; height: 142px; border-radius: 15px;
  background: linear-gradient(135deg, #2a2350 0%, #3b2f63 48%, #221b42 100%);
  position: absolute; left: 50%; bottom: 0; z-index: 1; overflow: hidden;
  transform: translateX(-50%) translateY(118%);   /* start: poniżej czytnika, w pełni widoczna */
  box-shadow: 0 22px 50px rgba(0,0,0,.6);
  padding: 16px 18px; color: #fff;
  display: flex; flex-direction: column; justify-content: space-between;
}
.co-card-sheen {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(120deg, transparent 34%, rgba(255,255,255,.10) 48%, transparent 60%);
}
.co-card-r1 { display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 1; }
.co-card-chip {
  width: 40px; height: 30px; border-radius: 6px; position: relative;
  background: linear-gradient(135deg, #ecd488, #b8942f);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.22);
}
.co-card-chip::after {
  content: ''; position: absolute; inset: 5px;
  background:
    linear-gradient(rgba(0,0,0,.22), rgba(0,0,0,.22)) center/100% 1px no-repeat,
    linear-gradient(rgba(0,0,0,.22), rgba(0,0,0,.22)) center/1px 100% no-repeat;
}
.co-card-type { font-size: .82rem; font-weight: 600; font-style: italic; color: rgba(255,255,255,.78); letter-spacing: .02em; }
.co-card-num {
  font-size: 1.2rem; letter-spacing: .1em; font-weight: 600; position: relative; z-index: 1;
  color: #fff; font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 0 rgba(0,0,0,.45), 0 -1px 0 rgba(255,255,255,.12);
}
.co-card-r3 { display: flex; align-items: flex-end; justify-content: space-between; position: relative; z-index: 1; }
.co-card-lbl { display: block; font-size: .52rem; letter-spacing: .1em; color: rgba(255,255,255,.5); text-transform: uppercase; }
.co-card-val { display: block; font-size: .8rem; font-weight: 600; color: rgba(255,255,255,.92); letter-spacing: .03em; }
.co-card-brand { font-weight: 900; font-size: 1.2rem; color: #95c11f; letter-spacing: -.01em; }

/* Karta gładko wsuwa się W GÓRĘ do czytnika i chowa za jego krawędzią.
   Geometria w % własnej wysokości → tak samo trafia na każdym ekranie. */
.co-scene.show .co-cardv { animation: coInsert 1s cubic-bezier(.5,0,.18,1) .35s forwards; }
@keyframes coInsert {
  0%   { transform: translateX(-50%) translateY(118%); }
  70%  { transform: translateX(-50%) translateY(4%); }    /* lekko wjeżdża głębiej */
  100% { transform: translateX(-50%) translateY(10%); }   /* spoczynek: mały pasek wystaje ze szczeliny */
}

/* ── Instalacja iOS profilem (.mobileconfig) — premium ── */
.ios-profile-card {
  background: #fff;
  border: 1px solid hsl(240 5.9% 90%);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 14px 30px -16px rgba(15,23,42,.18);
  margin-bottom: 12px;
}
.ios-profile-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.ios-profile-ico {
  width: 46px; height: 46px; border-radius: 11px; flex-shrink: 0;
  object-fit: cover; box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.ios-profile-title { font-weight: 800; font-size: .95rem; color: #1d2a3a; letter-spacing: -.01em; }
.ios-profile-sub { font-size: .76rem; color: var(--text-light); margin-top: 2px; }
.ios-profile-steps {
  margin-top: 12px; font-size: .76rem; line-height: 1.5; color: #475569;
  background: #f6f8fb; border-radius: 10px; padding: 10px 12px;
}
.install-or {
  text-align: center; font-size: .72rem; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: #9ca3af; margin: 14px 0 10px;
}
#installTabs .tab { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.tab-ico { width: 15px; height: 15px; flex-shrink: 0; }