/* =========================================================
   ClearDeal – nagłówki „Wszystkie oferty” i „Dodaj ofertę” (paczka 116)
   Plik: /var/www/cleardeal.store/css/cd-head.css (ładowany po cd-wow.css)
   Styl: poważny, elegancki – grafit + złota linia, bez „bąbelków”.
   ========================================================= */
:root {
  --h-ink: #0d1220; --h-ink2: #121a2c; --h-line: rgba(255,255,255,.08); --h-gold: #e7b324; --h-gold2: #f6d77a;
  --h-tx: #f3f5f9; --h-mu: #9aa3b5; --h-font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
}

/* ---------- wspólny nagłówek ----------
   Bez position / z-index – nagłówek nigdy nie wychodzi nad nawigację ani rozwijane menu.
   Złota linia, siatka i poświata to warstwy tła (background), a nie osobne elementy. */
.cdh, body.cd-wow-add .cdw-hero {
  position: static !important; z-index: auto !important; isolation: auto !important; overflow: hidden;
  display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 22px;
  margin: 0 0 18px; padding: 30px 30px 24px;
  border-radius: 18px; border: 1px solid var(--h-line);
  background:
    linear-gradient(90deg, transparent 0%, var(--h-gold) 18%, var(--h-gold2) 50%, var(--h-gold) 82%, transparent 100%) top / 100% 2px no-repeat,
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px) 0 0 / 28px 28px,
    radial-gradient(900px 260px at 0% 0%, rgba(231,179,36,.10), transparent 60%),
    linear-gradient(180deg, var(--h-ink2) 0%, var(--h-ink) 100%) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
  font-family: var(--h-font);
}
.cdh::before, .cdh::after, body.cd-wow-add .cdw-hero::before, body.cd-wow-add .cdw-hero::after { content: none !important; display: none !important; }
body.cd-wow-add .cdw-hero > :not(i) { position: static !important; z-index: auto !important; }

.cdh-kick, body.cd-wow-add .cdw-kick {
  display: inline-flex; align-items: center; gap: 8px;
  font: 700 11.5px/1 var(--h-font) !important; letter-spacing: 2.2px; text-transform: uppercase; color: var(--h-gold2) !important;
}
.cdh-kick::before, body.cd-wow-add .cdw-kick::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--h-gold);
  box-shadow: 0 0 0 4px rgba(231,179,36,.15), 0 0 14px rgba(231,179,36,.8);
}
.cdh-title, body.cd-wow-add .cdw-hero h1 {
  margin: 12px 0 8px !important; padding: 0 !important; border: 0 !important;
  font: 800 34px/1.1 var(--h-font) !important; letter-spacing: -.9px !important; text-align: left !important;
  color: var(--h-tx) !important; -webkit-text-fill-color: var(--h-tx) !important; background: none !important; text-shadow: none !important;
}
.cdh-title em, body.cd-wow-add .cdw-hero h1 em {
  font-style: normal; color: var(--h-gold2) !important;
  background: linear-gradient(90deg, var(--h-gold2), var(--h-gold)) !important; -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.cdh-sub, body.cd-wow-add .cdw-hero p {
  margin: 0 !important; max-width: 620px; color: var(--h-mu) !important; font: 400 15px/1.6 var(--h-font) !important;
}
.cdh-trust { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 16px 0 0; padding: 0; list-style: none; }
.cdh-trust li { display: inline-flex; align-items: center; gap: 7px; color: #cfd5e1; font: 600 13px var(--h-font); }
.cdh-trust li::before {
  content: ""; width: 16px; height: 16px; border-radius: 50%; flex: none;
  background: rgba(38,208,124,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.2 4.8-5' fill='none' stroke='%2326d07c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
}

.cdh-act { display: flex; flex-direction: column; gap: 10px; align-items: stretch; min-width: 210px; }
.cdh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 13px 20px; border-radius: 12px; text-decoration: none !important;
  font: 700 14.5px var(--h-font); letter-spacing: .2px; color: var(--h-tx) !important;
  border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.03);
  transition: box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.cdh-btn:hover { border-color: rgba(231,179,36,.55); background: rgba(231,179,36,.07); }
.cdh-btn b { font-size: 18px; line-height: 0; font-weight: 800; }
.cdh-btn--gold {
  color: #17110a !important; border-color: transparent;
  background: linear-gradient(180deg, #f8d977 0%, #e7b324 55%, #cf9b14 100%);
  box-shadow: 0 10px 26px rgba(231,179,36,.32), inset 0 1px 0 rgba(255,255,255,.55);
}
.cdh-btn--gold:hover { background: linear-gradient(180deg, #fbe39a 0%, #edbb30 55%, #d6a21a 100%); box-shadow: 0 14px 32px rgba(231,179,36,.42), inset 0 1px 0 rgba(255,255,255,.6); }
.cdh-btn small { font-weight: 600; opacity: .7; font-size: 12px; }

/* ---------- „Dodaj ofertę”: nagłówek formularza w tym samym stylu ---------- */
body.cd-wow-add .cdw-hero { display: block; margin: 8px 0 22px; }
body.cd-wow-add .cdw-hero > i { display: none !important; }
body.cd-wow-add .cdw-steps { display: flex; flex-wrap: wrap; gap: 0; margin-top: 20px; counter-reset: s; }
body.cd-wow-add .cdw-steps span {
  display: inline-flex; align-items: center; gap: 10px; padding: 0; margin: 0 12px 6px 0;
  background: none !important; border: 0 !important; border-radius: 0; color: #d9dee8 !important; font: 600 13.5px var(--h-font) !important;
}
body.cd-wow-add .cdw-steps span:not(:last-child)::after {
  content: ""; display: inline-block; width: 18px; height: 1px; margin-left: 2px; background: rgba(231,179,36,.5);
}
body.cd-wow-add .cdw-steps b {
  width: 26px !important; height: 26px !important; border-radius: 50% !important; display: grid; place-items: center;
  font: 800 12.5px var(--h-font) !important; color: var(--h-gold2) !important;
  background: rgba(231,179,36,.08) !important; border: 1px solid rgba(231,179,36,.6);
}

/* ---------- zakładki pod nagłówkiem: elegancki przełącznik ---------- */
body.cd-wow-offers .offers-tabs {
  gap: 4px !important; padding: 5px; margin: 0 0 18px !important; border-radius: 14px;
  background: rgba(10,14,24,.75); border: 1px solid var(--h-line);
}
body.cd-wow-offers .offers-tab {
  min-height: 46px; border-radius: 10px !important; border: 0 !important; background: transparent !important;
  color: #c6ccd8 !important; font: 700 14px var(--h-font) !important; letter-spacing: .1px; box-shadow: none !important; transform: none !important;
}
body.cd-wow-offers .offers-tab:hover { background: rgba(255,255,255,.04) !important; color: #fff !important; }
body.cd-wow-offers .offers-tab--active {
  color: #fff !important; background: linear-gradient(180deg, rgba(231,179,36,.16), rgba(231,179,36,.06)) !important;
  box-shadow: inset 0 0 0 1px rgba(231,179,36,.55), 0 6px 18px rgba(0,0,0,.25) !important;
}
body.cd-wow-offers .offers-tab-count {
  background: rgba(231,179,36,.18) !important; color: var(--h-gold2) !important; font: 800 12px var(--h-font) !important;
}

/* jasny motyw: przełącznik zakładek jasny, nagłówek zostaje ciemny (jak okładka) */
body.cd-wow-offers:not(.dark) .offers-tabs { background: #f2f3f6 !important; border-color: #e1e4ea !important; }
body.cd-wow-offers:not(.dark) .offers-tab { color: #4a5263 !important; }
body.cd-wow-offers:not(.dark) .offers-tab:hover { background: rgba(0,0,0,.035) !important; color: #11151f !important; }
body.cd-wow-offers:not(.dark) .offers-tab--active {
  color: #11151f !important; background: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(207,155,20,.7), 0 4px 14px rgba(17,21,31,.10) !important;
}
body.cd-wow-offers:not(.dark) .offers-tab-count { background: rgba(207,155,20,.15) !important; color: #8a6400 !important; }

/* ---------- telefon ---------- */
@media (max-width: 760px) {
  .cdh { grid-template-columns: 1fr; padding: 22px 18px 18px; gap: 16px; border-radius: 16px; }
  .cdh-act { flex-direction: row; min-width: 0; }
  .cdh-act .cdh-btn { flex: 1; padding: 12px 10px; font-size: 14px; }
  .cdh-title, body.cd-wow-add .cdw-hero h1 { font-size: 26px !important; }
  .cdh-sub, body.cd-wow-add .cdw-hero p { font-size: 14px !important; }
  body.cd-wow-add .cdw-hero { padding: 22px 18px 18px; }
  body.cd-wow-offers .offers-tab { font-size: 12.5px !important; min-height: 42px; padding: 6px 6px !important; }
}

/* ---------- paczka 116c: wersja skrócona – tylko podpis i opis ---------- */
.cdh.cdh--slim { display: block; padding: 22px 28px 20px; margin: 0 0 16px; }
.cdh--slim .cdh-sub { margin: 10px 0 0 !important; max-width: 760px; }
@media (max-width: 760px) { .cdh.cdh--slim { padding: 18px 18px 16px; } }

/* ---------- paczka 116d: bez kroków 1–2–3 w „Dodaj ofertę” ---------- */
body.cd-wow-add .cdw-steps { display: none !important; }