/* ==========================================================================
   Hitngo — oglasne enote Booking.com (CJ Affiliate)
   Pet razlicnih enot na stran, vsaka vodi na nastanitve v kraju te strani.

   Enote so oblikovane v jeziku strani, z Bookingovim modrim poudarkom.
   Namenoma NE posnemajo Bookingovega vmesnika do te mere, da bi obiskovalec
   mislil, da je ze na Booking.com - vsaka nosi oznako "Oglas".

   Barve: Booking modra #003580 / #0071c2, akcent #febb02.
   ========================================================================== */

.bk-ad {
  --bk-navy: #003580;
  --bk-blue: #0071c2;
  --bk-gold: #febb02;
  display: block;
  width: min(calc(100% - 40px), 1030px);
  margin: 46px auto;
  box-sizing: border-box;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.bk-ad * { box-sizing: border-box; }

.bk-ad--inline { width: 100%; margin: 38px auto; }

.bk-ad-label {
  margin: 0 0 8px;
  color: var(--muted, #65777a);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.bk-card {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  text-decoration: none !important;
  color: #fff;
  background: linear-gradient(135deg, #00224f 0%, #003580 52%, #0057b8 100%);
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 18px 46px rgba(0, 40, 90, .22);
  transition: transform .18s ease, box-shadow .18s ease;
}
.bk-card:hover { transform: translateY(-2px); box-shadow: 0 26px 60px rgba(0, 40, 90, .3); }
.bk-card:focus-visible { outline: 3px solid var(--bk-gold); outline-offset: 3px; }

.bk-kicker {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  color: #bfe0ff;
}
.bk-kicker::before {
  content: ""; width: 14px; height: 14px; border-radius: 3px; background: var(--bk-gold);
  flex: 0 0 auto;
}
.bk-title { margin: 9px 0 0; font-size: clamp(18px, 2.4vw, 25px); line-height: 1.12; font-weight: 800; letter-spacing: -.02em; }
.bk-sub { margin: 8px 0 0; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.82); }
.bk-cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
  padding: 11px 18px; border-radius: 10px;
  background: var(--bk-blue); color: #fff; font-size: 14px; font-weight: 800;
  box-shadow: 0 6px 18px rgba(0, 113, 194, .4);
}
.bk-card:hover .bk-cta { background: #0a84d8; }
.bk-note { margin: 12px 0 0; font-size: 11px; color: rgba(255,255,255,.6); }

/* --- 1) iskalna enota: posnema polje za iskanje, a je jasno oglas --- */
.bk-search { padding: 22px 22px 20px; }
.bk-search-row { display: grid; gap: 8px; margin-top: 15px; }
@media (min-width: 620px) { .bk-search-row { grid-template-columns: 1.4fr 1fr auto; align-items: center; } }
.bk-field {
  background: rgba(255,255,255,.96); color: #1a1a1a; border-radius: 9px;
  padding: 9px 12px; font-size: 13px; font-weight: 700;
  border: 2px solid var(--bk-gold); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.bk-field span { display: block; font-size: 10px; font-weight: 700; color: #6b7280; letter-spacing: .04em; text-transform: uppercase; }
.bk-search .bk-cta { margin-top: 0; justify-content: center; }

/* --- 2) Genius --- */
.bk-genius { padding: 22px; display: grid; gap: 16px; }
@media (min-width: 700px) { .bk-genius { grid-template-columns: 1fr auto; align-items: center; } }
.bk-badge {
  display: inline-block; padding: 7px 13px; border-radius: 8px;
  background: #fff; color: var(--bk-navy); font-weight: 900; font-size: 15px; letter-spacing: -.01em;
}

/* --- 3) najbolje ocenjene --- */
.bk-rated { padding: 22px; }
.bk-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.bk-chip {
  padding: 6px 11px; border-radius: 999px; font-size: 11.5px; font-weight: 700;
  background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.2); color: #eaf4ff;
}

/* --- 4) prozna odpoved --- */
.bk-flex { padding: 22px; display: grid; gap: 14px; }
@media (min-width: 700px) { .bk-flex { grid-template-columns: auto 1fr auto; align-items: center; } }
.bk-tick {
  width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.14);
  display: grid; place-items: center; font-size: 20px; flex: 0 0 auto;
}

/* --- 5) kompaktni pas --- */
.bk-strip {
  padding: 15px 18px; display: grid; gap: 12px;
  background: linear-gradient(120deg, #002a66 0%, #0057b8 100%);
}
@media (min-width: 640px) { .bk-strip { grid-template-columns: 1fr auto; align-items: center; } }
.bk-strip .bk-title { font-size: clamp(15px, 1.9vw, 19px); }
.bk-strip .bk-cta { margin-top: 0; padding: 9px 15px; font-size: 13px; }

@media print { .bk-ad { display: none; } }