/* ==========================================================================
   BAZY.BIZ — Redesign V2 design system
   Faithful port of "Bazy.biz Redesign - Full" (DesignCode prototype).
   Single stylesheet: tokens + components + hover/responsive (inline styles in
   the prototype that could not express :hover / @media live here as classes).
   Fonts: Hanken Grotesk (sans) + IBM Plex Mono (mono).
   ========================================================================== */

:root {
  --rd-ink:      #0F1C2A;
  --rd-slate:    #3D4F60;
  --rd-muted:    #5B6B7B;
  --rd-muted-2:  #8A98A5;
  --rd-faint:    #9AA7B2;

  --rd-blue:     #0074BA;
  --rd-blue-d:   #005C95;
  --rd-blue-l:   #EAF4FB;
  --rd-blue-bd:  #CBE4F4;

  --rd-green:    #10B981;
  --rd-green-d:  #0EA371;
  --rd-green-l:  #E7F8F1;
  --rd-green-bd: #BFEBDA;
  --rd-green-tx: #0B815A;
  --rd-mint:     #5EEAB7;

  --rd-amber-bg: #FDF4E5;
  --rd-amber-tx: #B45309;
  --rd-amber-bd: #F5DEB8;
  --rd-star:     #F5B301;

  --rd-line:     #E3E8EE;
  --rd-line-2:   #EDF1F5;
  --rd-line-3:   #F2F5F8;
  --rd-soft:     #F8FAFC;
  --rd-soft-2:   #F2F6F9;
  --rd-white:    #ffffff;

  --rd-sans: 'Hanken Grotesk', ui-sans-serif, system-ui, sans-serif;
  --rd-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

  --rd-maxw: 1320px;
  --rd-radius: 14px;
}

/* ---------- reset / base ---------- */
html:has(> .rd-root) { margin: 0; padding: 0; }
.rd-root, .rd-root * { box-sizing: border-box; }
.rd-root {
  margin: 0;
  padding: 0;
  font-family: var(--rd-sans);
  color: var(--rd-ink);
  background: var(--rd-white);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}
.rd-root button, .rd-root input, .rd-root select, .rd-root textarea { font-family: inherit; }
.rd-root input::placeholder, .rd-root textarea::placeholder { color: var(--rd-faint); }
/* :where() zeruje specyficzność selektora `a`, żeby utility Tailwinda
   (.text-white, .text-blue-700 itd., 0,1,0) wygrywały na linkach-przyciskach. */
.rd-root :where(a) { color: inherit; text-decoration: none; }
.rd-root h1, .rd-root h2, .rd-root h3, .rd-root h4, .rd-root p { margin: 0; }
.rd-root img { max-width: 100%; }

@keyframes pulseDot { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
.rd-pulse { animation: pulseDot 2s infinite; }

/* ---------- layout ---------- */
.rd-container { max-width: var(--rd-maxw); margin: 0 auto; padding-left: 28px; padding-right: 28px; }
.rd-mono { font-family: var(--rd-mono); }
.rd-soft-bg { background: var(--rd-soft); }

/* ---------- header ---------- */
.rd-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--rd-line);
}
.rd-header-inner {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 0 28px;
  height: 66px; display: flex; align-items: center; gap: 32px;
}
.rd-logo { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.rd-logo-col { display: flex; flex-direction: column; }
.rd-logo-txt { display: flex; align-items: baseline; line-height: 1.1; }
.rd-logo-tag { font-size: 9px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: var(--rd-muted-2); margin-top: 1px; }
.rd-logo-txt b { font-weight: 800; font-size: 20px; letter-spacing: -0.4px; color: var(--rd-ink); }
.rd-logo-txt span { font-weight: 800; font-size: 20px; letter-spacing: -0.4px; color: var(--rd-blue); }
.rd-nav { display: flex; gap: 6px; flex: 1; }
.rd-nav-btn {
  background: none; border: none; padding: 8px 12px; border-radius: 8px;
  font-size: 14.5px; font-weight: 600; color: var(--rd-slate); cursor: pointer;
  transition: background .15s, color .15s;
}
.rd-nav-btn:hover, .rd-nav-btn.is-active { background: var(--rd-soft-2); color: var(--rd-ink); }

/* ---------- nav dropdown „Monitoring" (mega-menu) ---------- */
.rd-nav-dd { position: relative; }
.rd-nav-dd-btn { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; }
.rd-nav-dd-caret { transition: transform .15s; margin-top: 1px; }
.rd-nav-dd:hover .rd-nav-dd-caret, .rd-nav-dd:focus-within .rd-nav-dd-caret { transform: rotate(180deg); }
.rd-nav-dd-pop {
  position: absolute; top: calc(100% + 8px); left: 0; z-index: 60;
  width: 420px; padding: 8px; background: var(--rd-white);
  border: 1px solid var(--rd-line); border-radius: var(--rd-radius);
  box-shadow: 0 18px 44px -20px rgba(15,28,42,0.34);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .15s, transform .15s, visibility .15s;
}
.rd-nav-dd:hover .rd-nav-dd-pop, .rd-nav-dd:focus-within .rd-nav-dd-pop {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.rd-nav-dd-pop::before { content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px; }
.rd-nav-dd-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 8px 10px 10px; }
.rd-nav-dd-title { font-family: var(--rd-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--rd-muted-2); }
.rd-nav-dd-all { font-size: 12px; font-weight: 600; color: var(--rd-blue); text-decoration: none; white-space: nowrap; }
.rd-nav-dd-all:hover { text-decoration: underline; }
.rd-nav-dd-grid { display: flex; flex-direction: column; gap: 2px; }
.rd-nav-dd-item { display: block; padding: 10px 10px; border-radius: 9px; text-decoration: none; }
a.rd-nav-dd-item:hover { background: var(--rd-soft-2); }
.rd-nav-dd-item-name { display: block; font-size: 14px; font-weight: 650; color: var(--rd-ink); }
.rd-nav-dd-item-desc { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--rd-muted); }
.rd-nav-dd-item.is-soon { cursor: default; }
.rd-nav-dd-item.is-soon .rd-nav-dd-item-name { color: var(--rd-muted-2); font-weight: 600; }
.rd-nav-dd-soon { font-family: var(--rd-mono); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--rd-amber-tx); background: var(--rd-amber-bg); border: 1px solid var(--rd-amber-bd);
  border-radius: 5px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }
.rd-mobile-sub { padding-left: 24px !important; font-size: 13.5px !important; color: var(--rd-muted) !important; }

.rd-header-actions { display: flex; align-items: center; gap: 10px; }

.rd-saldo {
  display: flex; flex-direction: column; gap: 4px; padding: 8px 14px;
  border: 1px solid var(--rd-line); border-radius: 10px; background: var(--rd-soft);
  cursor: pointer; transition: border-color .15s;
}
.rd-saldo:hover { border-color: var(--rd-blue); }
.rd-saldo-row { display: flex; align-items: baseline; gap: 6px; }
.rd-saldo-lbl { font-size: 11px; font-weight: 700; color: var(--rd-muted); text-transform: uppercase; letter-spacing: .5px; }
.rd-saldo-val { font-family: var(--rd-mono); font-size: 13px; font-weight: 600; color: var(--rd-ink); }
.rd-saldo-tot { font-family: var(--rd-mono); font-size: 11px; color: var(--rd-muted-2); }
.rd-saldo-bar { width: 130px; height: 4px; background: var(--rd-line); border-radius: 99px; overflow: hidden; }
.rd-saldo-bar > i { display: block; height: 100%; background: var(--rd-green); border-radius: 99px; }
.rd-avatar {
  width: 36px; height: 36px; border-radius: 50%; background: var(--rd-blue-l); color: var(--rd-blue);
  display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800;
  cursor: pointer; transition: background .15s; text-transform: uppercase;
}
.rd-avatar:hover { background: #D6EAF8; }
.rd-usermenu { position: relative; }
.rd-usermenu > button.rd-avatar { border: 0; font-family: inherit; padding: 0; }
.rd-usermenu-pop {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 190px; z-index: 60;
  background: #fff; border: 1px solid var(--rd-line); border-radius: 12px; padding: 6px;
  box-shadow: 0 14px 34px -14px rgba(15,28,42,.32);
}
.rd-usermenu-pop[hidden] { display: none; }
.rd-usermenu-head { padding: 8px 12px 6px; border-bottom: 1px solid var(--rd-line-2); margin-bottom: 4px; }
.rd-usermenu-head b { display: block; font-size: 13.5px; color: var(--rd-ink); }
.rd-usermenu-head span { font-size: 12px; color: var(--rd-muted-2); }
.rd-usermenu-pop a { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 8px; font-size: 14px; color: var(--rd-ink); text-decoration: none; }
.rd-usermenu-pop a:hover { background: var(--rd-soft); }
.rd-usermenu-pop a.is-danger { color: #B42318; }
.rd-usermenu-pop a.is-danger:hover { background: #FEF3F2; }

/* ---------- buttons ---------- */
.rd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid #D6DEE6; border-radius: 9px; padding: 10px 18px;
  font-family: var(--rd-sans); font-size: 14px; font-weight: 700; line-height: 1;
  /* sane default so a variant-less .rd-btn is never transparent/invisible */
  background: #fff; color: var(--rd-ink);
  cursor: pointer; transition: background .15s, border-color .15s, color .15s; text-align: center; text-decoration: none;
}
.rd-btn--lg { padding: 15px 26px; font-size: 16px; border-radius: 11px; }
.rd-btn--sm { padding: 9px 13px; font-size: 13px; }
.rd-btn--block { width: 100%; }
/* filled variants carry their own fill — drop the default border */
.rd-btn--primary, .rd-btn--success, .rd-btn--dark, .rd-btn--white { border-color: transparent; }

.rd-btn--primary { background: var(--rd-blue); color: #fff; box-shadow: 0 2px 6px rgba(0,116,186,.3); }
.rd-btn--primary:hover { background: var(--rd-blue-d); }

.rd-btn--success { background: #198754; color: #fff; box-shadow: 0 1px 2px rgba(25,135,84,.3); }
.rd-btn--success:hover { background: #157347; }
.rd-btn--success.rd-btn--lg { box-shadow: 0 2px 6px rgba(25,135,84,.35); }

.rd-btn--ghost { background: #fff; border-color: #D6DEE6; color: var(--rd-ink); }
.rd-btn--ghost:hover { border-color: var(--rd-blue); color: var(--rd-blue); }

.rd-btn--dark { background: var(--rd-ink); color: #fff; }
.rd-btn--dark:hover { background: #1c3147; }

.rd-btn--white { background: #fff; color: var(--rd-ink); border: none; }
.rd-btn--white:hover { background: #E8F0F6; }

.rd-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Anchor buttons: `.rd-root a { color: inherit }` (0,1,1) would otherwise beat the
   button color variants (0,1,0), making filled <a> buttons show dark text.
   These higher-specificity rules restore the correct button text colour. */
.rd-root a.rd-btn { color: var(--rd-ink); }
.rd-root a.rd-btn--primary, .rd-root a.rd-btn--success, .rd-root a.rd-btn--dark { color: #fff; }
.rd-root a.rd-btn--white { color: var(--rd-ink); }
.rd-root a.rd-btn--ghost:hover { color: var(--rd-blue); }

.rd-link { color: var(--rd-blue); font-weight: 700; cursor: pointer; background: none; border: none; }
.rd-link:hover { text-decoration: underline; }

/* ---------- cards ---------- */
.rd-card { background: #fff; border: 1px solid var(--rd-line); border-radius: var(--rd-radius); padding: 24px; }
.rd-card--pad-sm { padding: 16px; }
.rd-card--hover { transition: border-color .15s, box-shadow .15s; }
.rd-card--hover:hover { border-color: var(--rd-blue); box-shadow: 0 8px 24px -12px rgba(0,116,186,.25); }

/* ---------- badges / pills ---------- */
.rd-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
  padding: 4px 10px; border-radius: 6px; background: var(--rd-soft-2); color: var(--rd-slate);
}
.rd-badge--blue  { background: var(--rd-blue-l); color: var(--rd-blue-d); }
.rd-badge--green { background: var(--rd-green-l); color: var(--rd-green-tx); }
.rd-badge--amber { background: var(--rd-amber-bg); color: var(--rd-amber-tx); border: 1px solid var(--rd-amber-bd); }
.rd-badge--mono  { font-family: var(--rd-mono); text-transform: none; letter-spacing: 0; font-size: 11.5px; border: 1px solid var(--rd-line); background: var(--rd-soft-2); color: var(--rd-slate); }

.rd-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--rd-blue-l); border: 1px solid var(--rd-blue-bd); color: var(--rd-blue-d);
  font-size: 12.5px; font-weight: 700; padding: 6px 12px; border-radius: 99px;
  letter-spacing: .3px; text-transform: uppercase;
}
.rd-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--rd-green); }

.rd-chip {
  background: #fff; color: var(--rd-slate); border: 1px solid #D6DEE6;
  padding: 8px 15px; border-radius: 99px; font-size: 13.5px; font-weight: 600; cursor: pointer;
  transition: border-color .15s, color .15s;
}
.rd-chip:hover { border-color: var(--rd-ink); color: var(--rd-ink); }
.rd-chip.is-active { background: var(--rd-ink); color: #fff; border-color: var(--rd-ink); }

/* ---------- tables ---------- */
.rd-table { width: 100%; border-collapse: collapse; font-family: var(--rd-mono); font-size: 12.5px; }
.rd-table th {
  text-align: left; padding: 10px 14px; color: var(--rd-muted-2); font-weight: 600;
  font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; border-bottom: 1px solid var(--rd-line-2);
}
.rd-table td { padding: 11px 14px; border-bottom: 1px solid var(--rd-line-3); color: var(--rd-muted); }
.rd-table td.rd-td-strong { color: var(--rd-ink); font-weight: 500; white-space: nowrap; }

/* ---------- stat tiles ---------- */
.rd-stat { background: #fff; border: 1px solid var(--rd-line); border-radius: var(--rd-radius); padding: 20px 22px; }
.rd-stat--dark { background: var(--rd-ink); border-color: var(--rd-ink); }
.rd-stat-lbl { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--rd-muted-2); }
.rd-stat--dark .rd-stat-lbl { color: #9FB3C4; }
.rd-stat-val { font-family: var(--rd-mono); font-size: 32px; font-weight: 600; letter-spacing: -1px; margin-top: 6px; }
.rd-stat--dark .rd-stat-val { color: var(--rd-mint); }
.rd-progress { width: 100%; height: 4px; background: var(--rd-line-2); border-radius: 99px; margin-top: 10px; }
.rd-progress > i { display: block; height: 100%; border-radius: 99px; background: var(--rd-blue); }
.rd-progress > i.is-green { background: var(--rd-green); }
.rd-progress > i.is-grey { background: var(--rd-muted-2); }

/* ---------- breadcrumb ---------- */
.rd-crumb { font-size: 13px; color: var(--rd-muted-2); margin-bottom: 14px; }
.rd-crumb a { cursor: pointer; }
.rd-crumb a:hover { color: var(--rd-blue); }
.rd-crumb .sep { margin: 0 4px; }
.rd-crumb .cur { color: var(--rd-slate); font-weight: 600; }

/* ---------- forms ---------- */
.rd-label { display: block; font-size: 13px; font-weight: 700; color: var(--rd-slate); margin-bottom: 7px; }
.rd-input, .rd-select, .rd-textarea {
  width: 100%; background: #fff; border: 1px solid #D6DEE6; border-radius: 10px;
  padding: 11px 14px; font-size: 14.5px; color: var(--rd-ink); outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.rd-input:focus, .rd-select:focus, .rd-textarea:focus { border-color: var(--rd-blue); box-shadow: 0 0 0 3px rgba(0,116,186,.12); }
.rd-textarea { resize: vertical; min-height: 96px; }
/* pole asystenta AI (hero + /odkryj) — kolor i caret jawnie, bo textarea
   bez własnego color dostaje czarny z UA (niewidoczny kursor w dark mode) */
.rd-ai-input { color: var(--rd-ink); caret-color: var(--rd-blue); }
.rd-ai-input::placeholder { color: var(--rd-faint); }
.rd-ai-input--boxed:focus { border-color: var(--rd-blue) !important; box-shadow: 0 0 0 3px rgba(0,116,186,.12); }
.rd-help { font-size: 12.5px; color: var(--rd-muted-2); margin-top: 6px; }
.rd-error { font-size: 12.5px; color: #DC2626; margin-top: 6px; }
.rd-input.is-invalid, .rd-select.is-invalid { border-color: #DC2626; }

/* ---------- alerts ---------- */
.rd-alert { border-radius: 11px; padding: 14px 16px; font-size: 14px; line-height: 1.5; border: 1px solid; }
.rd-alert--info  { background: var(--rd-blue-l); border-color: var(--rd-blue-bd); color: var(--rd-blue-d); }
.rd-alert--ok    { background: var(--rd-green-l); border-color: var(--rd-green-bd); color: var(--rd-green-tx); }
.rd-alert--warn  { background: var(--rd-amber-bg); border-color: var(--rd-amber-bd); color: var(--rd-amber-tx); }
.rd-alert--error { background: #FEF2F2; border-color: #FCA5A5; color: #B91C1C; }

/* ---------- footer ---------- */
.rd-footer { border-top: 1px solid var(--rd-line); }
.rd-footer-inner {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 24px 28px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  font-size: 13px; color: var(--rd-muted-2); flex-wrap: wrap;
}
.rd-footer-links { display: flex; gap: 20px; flex-wrap: wrap; }
.rd-footer-links a { cursor: pointer; }
.rd-footer-links a:hover { color: var(--rd-ink); }

/* ---------- paginacja ---------- */
.rd-pag { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; }
.rd-pag-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 6px; border-radius: 9px;
  border: 1px solid var(--rd-line); background: var(--rd-white);
  font-family: var(--rd-mono); font-size: 13px; color: var(--rd-muted);
  font-variant-numeric: tabular-nums; transition: border-color .12s, color .12s;
}
a.rd-pag-btn:hover { border-color: var(--rd-muted-2); color: var(--rd-ink); }
.rd-pag-btn.is-active { background: var(--rd-blue); border-color: var(--rd-blue); color: #fff; }
.rd-pag-btn.is-disabled { background: var(--rd-soft); color: var(--rd-faint); }
.rd-pag-dots { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; font-family: var(--rd-mono); font-size: 13px; color: var(--rd-faint); }

/* ---------- subbar (drugi topbar: wyszukiwarka + skróty) ---------- */
.rd-subbar { background: var(--rd-white); border-bottom: 1px solid var(--rd-line); }
.rd-subbar-inner {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 8px 28px;
  display: flex; align-items: center; gap: 18px;
}
.rd-subbar-search {
  display: flex; align-items: center; gap: 8px; flex: 1 1 auto; max-width: 440px;
  background: var(--rd-soft); border: 1px solid var(--rd-line); border-radius: 9px; padding: 7px 12px;
  color: var(--rd-muted-2); transition: border-color .12s;
}
.rd-subbar-search:focus-within { border-color: var(--rd-blue); }
.rd-subbar-search input {
  flex: 1; min-width: 0; border: 0; background: none; outline: none;
  font-size: 13.5px; color: var(--rd-ink); font-family: inherit;
}
.rd-subbar-search input::placeholder { color: var(--rd-faint); }
.rd-subbar-links { display: flex; align-items: center; gap: 16px; margin-left: auto; }
.rd-subbar-links a { font-size: 13px; color: var(--rd-muted); white-space: nowrap; }
.rd-subbar-links a:hover { color: var(--rd-blue); }
.rd-subbar-links a.rd-subbar-hl {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 999px;
  background: rgba(41,163,236,.12); border: 1px solid rgba(41,163,236,.3);
  color: var(--rd-blue); font-weight: 700;
}
.rd-subbar-links a.rd-subbar-hl:hover { background: rgba(41,163,236,.2); }
.rd-subbar-links a.rd-subbar-hl--search {
  background: transparent; border-color: var(--rd-green); color: var(--rd-green-tx);
}
.rd-subbar-links a.rd-subbar-hl--search:hover { background: var(--rd-green-l); color: var(--rd-green-tx); }
@media (max-width: 760px) { .rd-subbar-links { display: none; } .rd-subbar-search { max-width: none; } }
html[data-rd-theme="dark"] .rd-subbar { background: #10171d; }
html[data-rd-theme="dark"] .rd-subbar-links a.rd-subbar-hl { background: rgba(41,163,236,.16); border-color: rgba(41,163,236,.38); color: #6BC2F2; }
html[data-rd-theme="dark"] .rd-subbar-links a.rd-subbar-hl--search { background: transparent; border-color: var(--rd-green-d); color: var(--rd-green); }
html[data-rd-theme="dark"] .rd-subbar-links a.rd-subbar-hl--search:hover { background: rgba(16,185,129,.12); }

/* ---------- alerty stanu konta ---------- */
.rd-acct-bar { border-bottom: 1px solid var(--rd-line); }
.rd-acct-bar--danger { background: #DC2626; color: #fff; }
.rd-acct-bar--warn { background: #FDE68A; color: #78350F; }
.rd-acct-bar-inner {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 12px 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  font-size: 14px; font-weight: 600;
}

/* ---------- mega footer ---------- */
.rd-mfoot { background: #0F1C2A; color: #C4D2DE; margin-top: 56px; }
.rd-mfoot a { color: #C4D2DE; text-decoration: none; transition: color .12s; }
.rd-mfoot a:hover { color: #fff; }
.rd-mfoot-news { border-bottom: 1px solid rgba(255,255,255,.08); }
.rd-mfoot-news-in {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 36px 28px;
  display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap;
}
.rd-mfoot-news-title { font-size: 20px; font-weight: 800; letter-spacing: -0.4px; color: #fff; margin-bottom: 6px; }
.rd-mfoot-news-sub { font-size: 14px; line-height: 1.55; color: #9FB3C4; }
.rd-mfoot-news-form { display: flex; gap: 10px; flex: 1 1 0; min-width: 280px; max-width: 440px; }
.rd-mfoot-news-input {
  flex: 1; min-width: 0; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
  color: #fff; padding: 13px 16px; border-radius: 10px; font-size: 14.5px; outline: none;
}
.rd-mfoot-news-input::placeholder { color: #7E93A6; }
.rd-mfoot-news-input:focus { border-color: rgba(255,255,255,.32); }
.rd-mfoot-news-btn {
  background: #10B981; border: none; color: #fff; padding: 13px 22px; border-radius: 10px;
  font-size: 14.5px; font-weight: 700; cursor: pointer; white-space: nowrap; transition: background .12s;
}
.rd-mfoot-news-btn:hover { background: #0EA372; }
.rd-mfoot-news-ok { font-size: 14px; font-weight: 600; color: #5EEAB7; }
.rd-mfoot-news-err { font-size: 12.5px; color: #FCA5A5; margin-top: 6px; }
.rd-mfoot-grid {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 48px 28px 40px;
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr; gap: 40px;
}
.rd-mfoot-brand { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; }
.rd-mfoot-brand-name { display: flex; align-items: baseline; font-weight: 800; font-size: 20px; letter-spacing: -0.4px; color: #fff; }
.rd-mfoot-brand-name em { font-style: normal; color: #4AA3DB; }
.rd-mfoot-desc { font-size: 13.5px; line-height: 1.6; color: #9FB3C4; margin: 0 0 18px; max-width: 280px; }
.rd-mfoot-contact { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.rd-mfoot-contact a { display: flex; align-items: center; gap: 9px; }
.rd-mfoot-h { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.8px; color: #7E93A6; margin-bottom: 16px; }
.rd-mfoot-col { display: flex; flex-direction: column; gap: 11px; font-size: 14px; }
.rd-mfoot-soon {
  font-size: 9.5px; font-weight: 800; letter-spacing: 0.4px; text-transform: uppercase;
  background: rgba(16,185,129,.15); color: #5EEAB7; padding: 2px 6px; border-radius: 5px;
}
.rd-mfoot-badges { border-top: 1px solid rgba(255,255,255,.08); }
.rd-mfoot-badges-in {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 20px 28px;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.rd-mfoot-badge {
  display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: #9FB3C4;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); padding: 7px 13px; border-radius: 99px;
}
.rd-mfoot-badge .rd-mfoot-stars { color: #F5B301; }
.rd-mfoot-bottom { border-top: 1px solid rgba(255,255,255,.08); }
.rd-mfoot-bottom-in {
  max-width: var(--rd-maxw); margin: 0 auto; padding: 20px 28px;
  display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap;
}
.rd-mfoot-copy { font-size: 13px; color: #7E93A6; }
.rd-mfoot-legal { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.rd-mfoot-legal a { font-size: 13px; color: #9FB3C4; }
.rd-mfoot-social { display: flex; gap: 8px; margin-left: 6px; }
.rd-mfoot-social a {
  width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: center;
}
.rd-mfoot-social a:hover { background: rgba(255,255,255,.12); }
@media (max-width: 960px) { .rd-mfoot-grid { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (max-width: 560px) { .rd-mfoot-grid { grid-template-columns: 1fr; } }

/* ---------- generic hover helpers ---------- */
.rd-hover-blue:hover { color: var(--rd-blue); }
.rd-hover-underline:hover { text-decoration: underline; }
.rd-row-hover { transition: background .12s; }
.rd-row-hover:hover { background: var(--rd-soft-2); }

/* ---------- text utilities ---------- */
.rd-h1 { font-size: 34px; font-weight: 800; letter-spacing: -1px; margin: 0 0 8px; }
.rd-h2 { font-size: 30px; font-weight: 800; letter-spacing: -0.8px; margin: 0; }
.rd-lead { font-size: 15.5px; color: var(--rd-muted); }
.rd-muted { color: var(--rd-muted); }
.rd-muted-2 { color: var(--rd-muted-2); }

/* ---------- PKD tree (cached blob from _pkd-tree-node, Tailwind-classed) ---------- */
#pkdTree ul, #pkdTreeFirmy ul { list-style: none; margin: 0; padding: 0; }
#pkdTree li, #pkdTreeFirmy li { margin: 0; }
#pkdTree summary { display: flex; align-items: center; gap: 5px; cursor: pointer; list-style: none;
  padding: 4px 6px; border-radius: 6px; font-size: 12px; line-height: 1.3; color: var(--rd-slate); }
#pkdTree summary::-webkit-details-marker { display: none; }
#pkdTree summary:hover, #pkdTree a:hover { background: var(--rd-soft-2); }
#pkdTree summary > svg { flex-shrink: 0; color: var(--rd-muted-2); transition: transform .12s; width: 9px; height: 9px; }
#pkdTree details[open] > summary > svg { transform: rotate(90deg); }
#pkdTree a, #pkdTree span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#pkdTree a { display: block; padding: 4px 6px; border-radius: 6px; font-size: 12px; line-height: 1.3; color: var(--rd-slate); }
#pkdTree summary a { padding: 0; }
#pkdTree > ul > li > details > summary,
#pkdTree details > div { border: 0; }
#pkdTree details > div { margin-left: 8px; border-left: 1px solid var(--rd-line); padding-left: 6px; }
#pkdTree .font-mono { font-family: var(--rd-mono); font-size: 10.5px; color: var(--rd-muted-2); }
#pkdTree .pkd-link.text-blue-700, #pkdTree .pkd-link.font-medium { color: var(--rd-blue); font-weight: 600; }

/* legacy-partial shim (year chart / star rating carry old utility classes) */
.rd-root .serif-italic { font-style: italic; }

/* ---------- prose (base/PKD descriptions, raw HTML) ---------- */
.rd-prose { font-size: 15px; line-height: 1.7; color: var(--rd-slate); }
.rd-prose > :first-child { margin-top: 0; }
.rd-prose h2 { font-size: 20px; font-weight: 800; letter-spacing: -0.4px; margin: 26px 0 12px; color: var(--rd-ink); }
.rd-prose h3 { font-size: 17px; font-weight: 700; margin: 22px 0 10px; color: var(--rd-ink); }
.rd-prose h4 { font-size: 15px; font-weight: 700; margin: 18px 0 8px; color: var(--rd-ink); }
.rd-prose p { margin: 0 0 14px; }
.rd-prose ul, .rd-prose ol { margin: 0 0 14px; padding-left: 22px; }
.rd-prose li { margin: 0 0 6px; }
.rd-prose a { color: var(--rd-blue); text-decoration: underline; }
.rd-prose a:hover { color: var(--rd-blue-d); }
.rd-prose strong { color: var(--rd-ink); }
.rd-prose blockquote { margin: 0 0 14px; padding: 12px 18px; border-left: 3px solid var(--rd-blue); background: var(--rd-blue-l); border-radius: 0 8px 8px 0; }
.rd-prose table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 14px; }
.rd-prose th, .rd-prose td { border: 1px solid var(--rd-line); padding: 8px 12px; text-align: left; }
.rd-prose img { border-radius: 10px; }

/* ---------- segmented control (period / netto-brutto toggles) ---------- */
.rd-seg { display: inline-flex; background: var(--rd-soft-2); border: 1px solid var(--rd-line); border-radius: 10px; padding: 4px; gap: 2px; }
.rd-seg-btn { border: none; background: none; padding: 8px 16px; border-radius: 8px; font-size: 13.5px; font-weight: 700;
  cursor: pointer; color: var(--rd-slate); font-family: var(--rd-sans); }
.rd-seg-btn.is-active { background: #fff; color: var(--rd-ink); box-shadow: 0 1px 2px rgba(15,28,42,.12); }

/* ---------- range slider ---------- */
.rd-range { width: 100%; accent-color: var(--rd-blue); cursor: pointer; }

/* ---------- visibility helpers (used by inline form JS) ---------- */
.rd-root .hidden, .rd-root .d-none { display: none !important; }

/* ---------- auth card ---------- */
.rd-auth-wrap { background: var(--rd-soft-2); min-height: calc(100vh - 66px); padding: 44px 20px 90px; }
.rd-auth-card { background: #fff; border: 1px solid var(--rd-line); border-radius: 16px; padding: 32px; box-shadow: 0 10px 30px -20px rgba(15,28,42,.2); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1100px) {
  .rd-plans-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 960px) {
  .rd-grid-2, .rd-grid-3, .rd-grid-4, .rd-hero-grid,
  .rd-single-grid, .rd-filter-grid, .rd-plans-grid { grid-template-columns: 1fr !important; }
  /* single-page sidebar: un-stick and drop the tall PKD tree on small screens */
  .rd-single-aside { position: static !important; }
  .rd-single-aside #pkdTree { max-height: 320px; }
  .rd-saldo-bar { width: 96px; }
  .rd-h1 { font-size: 28px; }
  .rd-h2 { font-size: 24px; }
}
@media (max-width: 760px) {
  /* hide desktop inline nav; show hamburger + dropdown */
  .rd-nav { display: none; }
  .rd-nav-toggle { display: inline-flex !important; }
  .rd-mobile-nav.is-open { display: flex !important; }
}
@media (max-width: 700px) {
  .rd-container { padding-left: 18px; padding-right: 18px; }
  .rd-header-inner { padding: 0 18px; gap: 12px; }
  .rd-hide-sm { display: none !important; }
  .rd-stack-sm { flex-direction: column !important; align-items: stretch !important; }
  .rd-stack-sm > * { width: 100%; }
}

/* mobile nav (hidden on desktop) */
.rd-nav-toggle { display: none; align-items: center; justify-content: center; width: 38px; height: 38px;
  border: 1px solid #D6DEE6; border-radius: 9px; background: #fff; cursor: pointer; color: var(--rd-ink); }
.rd-mobile-nav { display: none; flex-direction: column; gap: 2px; padding: 8px 18px 14px; border-bottom: 1px solid var(--rd-line); background: #fff; }
.rd-mobile-nav a { padding: 11px 12px; border-radius: 8px; font-size: 15px; font-weight: 600; color: var(--rd-slate); }
.rd-mobile-nav a:hover, .rd-mobile-nav a.is-active { background: var(--rd-soft-2); color: var(--rd-ink); }

/* ---------- testimonials carousel (strona główna) ---------- */
.rd-testi-carousel { position: relative; }
.rd-testi-viewport { overflow: hidden; padding: 6px; margin: -6px; }
.rd-testi-track { display: flex; transition: transform .5s ease; }
.rd-testi-slide { flex: 0 0 100%; display: flex; gap: 20px; }
.rd-testi-item { flex: 1 1 0; min-width: 0; }
.rd-testi-quote {
  font-size: 15px; line-height: 1.7; color: var(--rd-muted); font-style: italic;
  margin: 0 0 18px; text-wrap: pretty; flex: 1 1 auto;
}
.rd-testi-author {
  display: flex; align-items: center; gap: 12px;
  border-top: 1px solid var(--rd-line-2); padding-top: 14px; margin-top: auto;
}
.rd-testi-avatar {
  width: 46px; height: 46px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 15px;
  background: linear-gradient(135deg, var(--rd-blue), #22B8E6);
}
.rd-testi-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 44px; height: 44px; border-radius: 50%; cursor: pointer;
  background: #fff; border: 1px solid var(--rd-line); color: var(--rd-ink);
  font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.06); transition: background .2s, color .2s, border-color .2s;
}
.rd-testi-nav:hover { background: var(--rd-blue); border-color: var(--rd-blue); color: #fff; }
.rd-testi-nav--prev { left: -18px; }
.rd-testi-nav--next { right: -18px; }
.rd-testi-dots { display: flex; justify-content: center; gap: 8px; margin-top: 24px; }
.rd-testi-dot {
  width: 10px; height: 10px; border-radius: 50%; padding: 0; border: none; cursor: pointer;
  background: var(--rd-line); transition: background .2s, transform .2s;
}
.rd-testi-dot.is-active { background: var(--rd-blue); transform: scale(1.15); }

/* liczba widocznych kart: 3 (lg) / 2 (md) / 1 (mobile) — jak na bazy.biz */
@media (max-width: 991px) {
  .rd-testi-item--lg { display: none; }
  .rd-testi-nav { display: none; }
}
@media (max-width: 767px) {
  .rd-testi-item--md { display: none; }
}

/* ==========================================================================
   DARK MODE — nadpisania tokenów + komponentów. Aktywne przy
   <html data-rd-theme="dark"> (ustawiane skryptem w layoutach/redesign).
   ========================================================================== */
html[data-rd-theme="dark"] {
  --rd-ink:      #E7EDF3;
  --rd-slate:    #B7C4D0;
  --rd-muted:    #93A2B0;
  --rd-muted-2:  #7C8B98;
  --rd-faint:    #6E7C89;

  --rd-blue:     #3AA0E4;
  --rd-blue-d:   #59B0EA;
  --rd-blue-l:   #14273550;
  --rd-blue-bd:  #274257;

  --rd-green:    #16C088;
  --rd-green-d:  #12A876;
  --rd-green-l:  #10261F;
  --rd-green-bd: #1E4638;
  --rd-green-tx: #46D3A0;

  --rd-amber-bg: #2A2113;
  --rd-amber-tx: #E0A64B;
  --rd-amber-bd: #4A3B1E;
  --rd-star:     #F5B301;

  --rd-line:     #26323E;
  --rd-line-2:   #202A34;
  --rd-line-3:   #1B242D;
  --rd-soft:     #131B23;
  --rd-soft-2:   #16202A;
  --rd-white:    #1A242E;   /* powierzchnia kart */
}

/* tło strony ciemniejsze niż karty (warstwowanie: page < soft < card) */
html[data-rd-theme="dark"] body.rd-root,
html[data-rd-theme="dark"] .rd-root { background: #0E151C; color: var(--rd-ink); }

/* komponenty z zaszytym na twardo #fff */
html[data-rd-theme="dark"] .rd-header { background: rgba(14,21,28,.85); }
html[data-rd-theme="dark"] .rd-card,
html[data-rd-theme="dark"] .rd-stat,
html[data-rd-theme="dark"] .rd-auth-card,
html[data-rd-theme="dark"] .rd-usermenu-pop,
html[data-rd-theme="dark"] .rd-nav-dd-pop,
html[data-rd-theme="dark"] .rd-mobile-nav { background: var(--rd-white); }
html[data-rd-theme="dark"] .rd-btn--ghost,
html[data-rd-theme="dark"] .rd-btn--white,
html[data-rd-theme="dark"] .rd-input,
html[data-rd-theme="dark"] .rd-select,
html[data-rd-theme="dark"] .rd-textarea,
html[data-rd-theme="dark"] .rd-chip,
html[data-rd-theme="dark"] .rd-pill,
html[data-rd-theme="dark"] .rd-nav-toggle,
html[data-rd-theme="dark"] .rd-seg-btn.is-active,
html[data-rd-theme="dark"] .rd-testi-nav {
  background: var(--rd-white); border-color: var(--rd-line); color: var(--rd-ink);
}
/* ciemny przycisk / aktywny chip używały --rd-ink jako TŁA (teraz jasne) — przywróć ciemną powierzchnię */
html[data-rd-theme="dark"] .rd-btn--dark { background: #2A3742; color: var(--rd-ink); }
html[data-rd-theme="dark"] .rd-chip.is-active { background: var(--rd-blue); border-color: var(--rd-blue); color: #06121C; }
html[data-rd-theme="dark"] .rd-usermenu-pop a.is-danger:hover { background: #2A1414; }

/* inline'owe tła w blade'ach (nie da się ich nadpisać tokenem) — celowane selektorem atrybutowym */
html[data-rd-theme="dark"] [style*="background:#fff"],
html[data-rd-theme="dark"] [style*="background: #fff"],
html[data-rd-theme="dark"] [style*="background:var(--rd-white)"] { background: var(--rd-white) !important; }
/* „ciemne panele" (CTA itd.) trzymały biały/muted tekst — zostaw je ciemne, nieco jaśniejsze od tła */
html[data-rd-theme="dark"] [style*="background:var(--rd-ink)"] { background: #16212B !important; }

/* przełącznik motywu */
.rd-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; flex-shrink: 0;
  border: 1px solid #D6DEE6; border-radius: 9px; background: transparent;
  cursor: pointer; color: var(--rd-slate); transition: color .15s, border-color .15s;
}
.rd-theme-toggle:hover { color: var(--rd-ink); border-color: var(--rd-blue); }
html[data-rd-theme="dark"] .rd-theme-toggle { border-color: var(--rd-line); }
.rd-theme-toggle .rd-ico-sun { display: none; }
.rd-theme-toggle .rd-ico-moon { display: block; }
html[data-rd-theme="dark"] .rd-theme-toggle .rd-ico-moon { display: none; }
html[data-rd-theme="dark"] .rd-theme-toggle .rd-ico-sun { display: block; }

/* ==========================================================================
   DARK MODE — strony na Tailwind CDN (@section rdTailwind): why-us, blog.
   Mapujemy KONKRETNIE użyte utili Tailwind na tokeny. Półprzezroczyste
   nakładki (bg-white/10, border-white/30) i ciemne sekcje (stone-800/900)
   celowo pomijamy — działają na ciemnym tle.
   ========================================================================== */
html[data-rd-theme="dark"] .bg-white { background-color: var(--rd-white) !important; }
html[data-rd-theme="dark"] .bg-stone-50,
html[data-rd-theme="dark"] .bg-stone-50\/50,
html[data-rd-theme="dark"] .bg-stone-50\/60 { background-color: var(--rd-soft) !important; }
html[data-rd-theme="dark"] .bg-stone-100,
html[data-rd-theme="dark"] .bg-stone-200 { background-color: var(--rd-soft-2) !important; }
/* kolorowe tinty -50 (callouty/wyróżnienia) → ciemne warianty na tokenach */
html[data-rd-theme="dark"] .bg-blue-50,
html[data-rd-theme="dark"] .bg-blue-50\/50,
html[data-rd-theme="dark"] .bg-blue-50\/60,
html[data-rd-theme="dark"] .bg-indigo-50 { background-color: var(--rd-blue-l) !important; }
html[data-rd-theme="dark"] .bg-emerald-50,
html[data-rd-theme="dark"] .bg-emerald-50\/40,
html[data-rd-theme="dark"] .bg-teal-50 { background-color: var(--rd-green-l) !important; }
html[data-rd-theme="dark"] .bg-amber-50,
html[data-rd-theme="dark"] .bg-amber-50\/60,
html[data-rd-theme="dark"] .bg-orange-50 { background-color: var(--rd-amber-bg) !important; }
html[data-rd-theme="dark"] .bg-red-50,
html[data-rd-theme="dark"] .bg-rose-50 { background-color: #2A1618 !important; }

html[data-rd-theme="dark"] .text-stone-900,
html[data-rd-theme="dark"] .text-stone-800 { color: var(--rd-ink) !important; }
html[data-rd-theme="dark"] .text-stone-700,
html[data-rd-theme="dark"] .text-stone-600 { color: var(--rd-slate) !important; }
html[data-rd-theme="dark"] .text-stone-500 { color: var(--rd-muted) !important; }
html[data-rd-theme="dark"] .text-stone-400 { color: var(--rd-muted-2) !important; }
html[data-rd-theme="dark"] .text-stone-300 { color: var(--rd-faint) !important; }
html[data-rd-theme="dark"] .text-blue-700,
html[data-rd-theme="dark"] .text-blue-600 { color: var(--rd-blue-d) !important; }

html[data-rd-theme="dark"] .border-stone-200,
html[data-rd-theme="dark"] .border-stone-300 { border-color: var(--rd-line) !important; }
html[data-rd-theme="dark"] .border-emerald-200 { border-color: var(--rd-green-bd) !important; }
html[data-rd-theme="dark"] .border-red-200 { border-color: #4A2626 !important; }
/* border-blue-* zostają — to celowe akcenty, czytelne na ciemnym */

/* hover-warianty jasnych powierzchni (podświetlenia wierszy list, np. „Działy PKD") —
   bez mapowania hover dawał jasny #FAFAF9 na ciemnej karcie i nieczytelny tekst */
html[data-rd-theme="dark"] .hover\:bg-stone-50:hover,
html[data-rd-theme="dark"] .hover\:bg-stone-100:hover { background-color: rgba(255,255,255,.06) !important; }
html[data-rd-theme="dark"] .hover\:text-stone-900:hover,
html[data-rd-theme="dark"] .hover\:text-stone-800:hover { color: var(--rd-ink) !important; }
html[data-rd-theme="dark"] .hover\:text-stone-700:hover { color: var(--rd-slate) !important; }
html[data-rd-theme="dark"] .hover\:border-stone-300:hover,
html[data-rd-theme="dark"] .hover\:border-stone-400:hover { border-color: var(--rd-muted-2) !important; }