/* landings/domeny/style.css — style WŁASNE landingu Domeny (wyszukiwarka wolnych domen).
   Wspólny arkusz /landings/_shared/landing.css zostaje nietknięty: pięć landingów powstaje
   równolegle i każdy dopisek tam to konflikt. Ładowany PO wspólnym (landing_head opts['css']),
   więc nadpisuje go bez !important. Zmienne (--lp, --green, --r*, --shadow*) pochodzą stamtąd;
   akcent landingu to cyjan z body.theme-domeny. */

/* ── Sekcja wyszukiwarki ────────────────────────────────────────────────────── */
/* Hero jest białe, a sekcja stoi w kolorze tła strony — gradient prowadzi z bieli do tła,
   zgodnie z zasadą z landing.css („gradient jest PRZEJŚCIEM do koloru, który następna sekcja
   naprawdę ma"). */
.ds-sec { background:linear-gradient(180deg, var(--surface) 0%, var(--bg) 22%); }

/* wejście do wyszukiwarki z hero — świadomie NIE przycisk, żeby nie konkurować z „Przenieś domenę" */
.ds-herolink { display:inline-flex; align-items:center; gap:7px; margin-top:16px;
  color:var(--lp); font-weight:600; font-size:.95rem; text-decoration:none;
  border-bottom:1px solid color-mix(in srgb, var(--lp) 35%, transparent); padding-bottom:2px; }
.ds-herolink:hover { border-bottom-color:var(--lp); }

/* ── Pole wyszukiwania ──────────────────────────────────────────────────────── */
.ds-box { max-width:720px; margin:28px auto 0; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-xl); box-shadow:var(--shadow-lg); padding:22px 22px 18px; }
.ds-label { display:block; font-size:.78rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.09em; color:var(--fg-muted); margin-bottom:9px; }
.ds-row { display:flex; gap:10px; align-items:stretch; }
.ds-field { flex:1 1 auto; min-width:0; position:relative; display:flex; }
.ds-input { flex:1 1 auto; min-width:0; width:100%; font:inherit; font-size:1.05rem; font-weight:600;
  color:var(--fg); background:var(--bg); border:1px solid var(--border-strong); border-radius:var(--r);
  padding:14px 16px; transition:border-color .15s, box-shadow .15s; }
.ds-input::placeholder { color:var(--fg-muted); font-weight:400; }
.ds-input:focus { outline:none; border-color:var(--lp); background:var(--surface);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--lp) 18%, transparent); }
.ds-go { flex:0 0 auto; white-space:nowrap; }
.ds-go[disabled] { opacity:.62; cursor:progress; box-shadow:none; }
.ds-hint { margin:11px 2px 0; font-size:.82rem; color:var(--fg-muted); line-height:1.5; }

/* widoczny focus z klawiatury — bez tego tabowanie po wynikach jest niewidoczne */
.ds-box :focus-visible, .ds-out :focus-visible, .ds-herolink:focus-visible {
  outline:2px solid var(--lp); outline-offset:2px; border-radius:var(--r-sm); }

/* ── Wyniki ─────────────────────────────────────────────────────────────────── */
.ds-out { max-width:720px; margin:18px auto 0; }
.ds-out:empty { display:none; }

.ds-msg { background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:var(--r); padding:14px 16px; font-size:.92rem; color:var(--fg-secondary); }
.ds-msg a { color:var(--accent-fg); font-weight:600; }

.ds-list { display:flex; flex-direction:column; gap:8px; }
.ds-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  margin:0 4px 10px; font-size:.86rem; color:var(--fg-secondary); }
.ds-head b { color:var(--fg); }
.ds-head .ds-note { color:var(--fg-muted); font-size:.8rem; }

.ds-item { display:flex; align-items:center; gap:14px; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-lg); padding:13px 16px; }
.ds-item .ds-mark { flex:0 0 auto; width:24px; height:24px; border-radius:50%; display:grid;
  place-items:center; font-size:.82rem; font-weight:800; color:#fff; background:var(--border-strong); }
.ds-item .ds-name { flex:1 1 auto; min-width:0; font-size:1.02rem; font-weight:700; color:var(--fg);
  overflow-wrap:anywhere; }
.ds-item .ds-name span { display:block; margin-top:2px; font-size:.78rem; font-weight:500; color:var(--fg-muted); }
.ds-item .ds-right { flex:0 0 auto; display:flex; align-items:center; gap:12px; }
.ds-item .ds-price { font-size:.95rem; font-weight:800; color:var(--fg); white-space:nowrap; }
.ds-item .ds-price i { display:block; font-style:normal; font-size:.72rem; font-weight:500; color:var(--fg-muted); }

/* wolna — to jest wiersz, który ma cieszyć */
.ds-item.free { border-color:color-mix(in srgb, var(--green) 38%, var(--border));
  background:color-mix(in srgb, var(--green) 5%, var(--surface)); }
.ds-item.free .ds-mark { background:var(--green); }
.ds-item.free .ds-price { color:var(--green); }
.ds-cta { display:inline-flex; align-items:center; gap:6px; background:var(--accent); color:#fff;
  border:none; border-radius:var(--r); padding:10px 16px; font:inherit; font-size:.88rem; font-weight:700;
  cursor:pointer; text-decoration:none; white-space:nowrap; box-shadow:0 3px 10px rgba(255,111,0,.24); }
.ds-cta:hover { background:var(--accent-light); }
.ds-cta:active { background:var(--accent-hover); }
.ds-cta.ghost { background:transparent; color:var(--navy); border:1px solid var(--border-strong); box-shadow:none; }
.ds-cta.ghost:hover { background:var(--navy); border-color:var(--navy); color:#fff; }

/* zajęta — wyraźnie oznaczona, ale bez krzyku: to nie jest błąd użytkownika */
.ds-item.taken { background:var(--bg); border-color:var(--border); }
.ds-item.taken .ds-mark { background:var(--fg-muted); }
.ds-item.taken .ds-name { color:var(--fg-muted); font-weight:600; text-decoration:line-through;
  text-decoration-color:var(--border-strong); }
.ds-item.taken .ds-name span { text-decoration:none; }
.ds-badge { display:inline-block; background:var(--fg-muted); color:#fff; font-size:.68rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.05em; padding:3px 9px; border-radius:999px; }
.ds-item.unknown .ds-mark { background:var(--accent-light); }
.ds-item.unknown .ds-name { color:var(--fg-secondary); }
.ds-swap { font-size:.8rem; font-weight:600; color:var(--accent-fg); text-decoration:none; white-space:nowrap; }
.ds-swap:hover { text-decoration:underline; }

/* pigułka „najczęstsza dla NGO" przy końcówkach, które dla organizacji znaczą najwięcej */
.ds-tag { display:inline-block; margin-left:8px; background:var(--lp-soft); color:var(--lp);
  border:1px solid color-mix(in srgb, var(--lp) 28%, transparent); font-size:.66rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.05em; padding:2px 8px; border-radius:999px; vertical-align:middle; }

.ds-foot { margin:14px 4px 0; font-size:.84rem; color:var(--fg-muted); line-height:1.55; }
.ds-foot a { color:var(--accent-fg); font-weight:600; }

/* ── Stan ładowania ─────────────────────────────────────────────────────────── */
.ds-skel { height:52px; border-radius:var(--r-lg); border:1px solid var(--border); background:var(--surface);
  position:relative; overflow:hidden; }
.ds-skel::after { content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--lp) 10%, transparent), transparent);
  animation:ds-shine 1.15s infinite; }
@keyframes ds-shine { 100% { transform:translateX(100%); } }
@media (prefers-reduced-motion:reduce) { .ds-skel::after { animation:none; } }

/* ── Telefon ────────────────────────────────────────────────────────────────── */
@media (max-width:640px) {
  .ds-box { padding:18px 16px 15px; }
  .ds-row { flex-direction:column; }
  .ds-go { width:100%; justify-content:center; }
  .ds-item { flex-wrap:wrap; gap:10px 12px; }
  .ds-item .ds-name { flex:1 1 100%; order:1; }
  .ds-item .ds-mark { order:0; }
  .ds-item .ds-right { order:2; flex:1 1 100%; justify-content:space-between; }
  .ds-cta { flex:0 0 auto; }
}