/*
 * Nagyker – Hol próbálható ki? — alap stílus (kikapcsolható).
 * Felülírható a témában vagy a bővítmény „Saját CSS” mezőjében; a színek CSS-változók.
 * A térkép méretét (szélesség, magasság: --nagyker-hpk-height) és a blokk legnagyobb
 * szélességét (--nagyker-hpk-max-width) a bővítmény mindig betölti, az alap stílus nélkül is.
 */
.nagyker-hpk {
  --nagyker-hpk-accent: #0f6f69;
  --nagyker-hpk-muted: #5b6475;
  --nagyker-hpk-border: #e2e6eb;
  --nagyker-hpk-soft: #f5f8f9;
  --nagyker-hpk-radius: 12px;
  clear: both;
  margin-top: 2em;
  margin-bottom: 2em;
}

/* A cím, a bevezető, a térképes widget és a címlista egy vonalban, a blokk szélességében. */
.nagyker-hpk__title { margin: 0 0 .3em; }
.nagyker-hpk__lead { margin: 0 0 1em; color: var(--nagyker-hpk-muted); }
.nagyker-hpk__widget { overflow: hidden; border-radius: var(--nagyker-hpk-radius); }

/* Címlista: alapból csukva, lenyitva kártyák. A tartalom a forrásban van (keresők, AI). */
.nagyker-hpk__list { margin-top: 1em; }
.nagyker-hpk__list > summary {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  padding: .55em 1em;
  border: 1px solid var(--nagyker-hpk-border);
  border-radius: 999px;
  background: #fff;
  color: var(--nagyker-hpk-accent);
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  transition: background .15s ease, border-color .15s ease;
}
.nagyker-hpk__list > summary::-webkit-details-marker { display: none; }
.nagyker-hpk__list > summary::after {
  content: "";
  width: .5em;
  height: .5em;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-.15em) rotate(45deg);
  transition: transform .15s ease;
}
.nagyker-hpk__list[open] > summary::after { transform: translateY(.1em) rotate(-135deg); }
.nagyker-hpk__list > summary:hover { border-color: var(--nagyker-hpk-accent); background: var(--nagyker-hpk-soft); }
.nagyker-hpk__list > summary:focus-visible { outline: 3px solid var(--nagyker-hpk-accent); outline-offset: 2px; }
.nagyker-hpk__list ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  margin: 1em 0 0;
  padding: 0;
  list-style: none;
}
.nagyker-hpk__store {
  display: flex;
  flex-direction: column;
  gap: .3em;
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--nagyker-hpk-border);
  border-left: 4px solid var(--nagyker-hpk-accent);
  border-radius: var(--nagyker-hpk-radius);
  background: #fff;
  box-shadow: 0 6px 18px rgba(23, 32, 51, .06);
  font-size: .92em;
  line-height: 1.45;
}
.nagyker-hpk__store-name { font-size: 1.08em; }
.nagyker-hpk__store-addr { color: inherit; }
.nagyker-hpk__store-line,
.nagyker-hpk__store-contact { color: var(--nagyker-hpk-muted); }
.nagyker-hpk__store a { color: var(--nagyker-hpk-accent); }
.nagyker-hpk__store-route { margin-top: auto; padding-top: .4em; }
.nagyker-hpk__store-route a {
  display: inline-block;
  padding: .4em .9em;
  border-radius: 8px;
  background: var(--nagyker-hpk-accent);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
}
.nagyker-hpk__store-route a:hover,
.nagyker-hpk__store-route a:focus-visible { filter: brightness(1.08); color: #fff; }