/* ============================================================
   GIN „HÍD" CSS  —  Bizreview (Barrio/Bootstrap) markup → Gin kinézet
   ------------------------------------------------------------
   A gin-form.css a Claro-markupra (.form-element) van írva; ez a fájl a
   Gin design-tokeneket (--gin-*) ráhúzza a Barrio TÉNYLEGES markupjára
   (.form-control, .form-select, .form-check, .btn) elem-/attribútum-
   szelektorokkal. Minden a [data-drupal-admin-styles] (= a <form>) alá
   van zárva, így csak az érintett űrlapokra hat.
   ============================================================ */

/* ------------------------------------------------------------
   0) Hiányzó akcentus-tokenek pótlása (Gin futásidőben injektálná).
   A 01.jpg sötét „Mentés" gombjához igazítva. Kék/zöld akcentushoz
   ITT írd át a --gin-color-primary értékét.
   ------------------------------------------------------------ */
[data-drupal-admin-styles] {
  --gin-color-primary: #1b1b1d;
  --gin-color-primary-hover: #000;
  --gin-color-primary-active: #000;
  --gin-color-primary-light: rgba(0, 0, 0, .12);
  --gin-color-primary-light-hover: rgba(0, 0, 0, .16);
  --gin-color-primary-light-active: rgba(0, 0, 0, .2);

  /* Gin-szerű betűkészlet (Ginter nélkül, rendszer-fallbackkel). */
  --pk-gin-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ------------------------------------------------------------
   1) Az ŰRLAP mint Gin-kártya (fehér, középre zárt, max. szélesség)
   ------------------------------------------------------------ */
[data-drupal-admin-styles] {
  box-sizing: border-box;
  max-width: 64rem;
  margin-inline: auto;
  margin-block: 1.5rem;
  padding: 1.75rem 2rem;
  background: var(--gin-bg-layer, #fff);
  border: 1px solid var(--gin-border-color, #d4d4d8);
  border-radius: var(--gin-border-l, .75rem);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, .03),
    0 3px 6px rgba(0, 0, 0, .04),
    0 8px 16px rgba(0, 0, 0, .04);
  color: var(--gin-color-text, #222330);
  font-family: var(--pk-gin-font);
}
[data-drupal-admin-styles] * {
  font-family: inherit;
}

/* ------------------------------------------------------------
   2) Szöveges beviteli mezők + textarea + select
   ------------------------------------------------------------ */
[data-drupal-admin-styles] input[type="text"],
[data-drupal-admin-styles] input[type="email"],
[data-drupal-admin-styles] input[type="tel"],
[data-drupal-admin-styles] input[type="url"],
[data-drupal-admin-styles] input[type="number"],
[data-drupal-admin-styles] input[type="search"],
[data-drupal-admin-styles] input[type="password"],
[data-drupal-admin-styles] input[type="date"],
[data-drupal-admin-styles] input[type="time"],
[data-drupal-admin-styles] input[type="datetime-local"],
[data-drupal-admin-styles] input[type="month"],
[data-drupal-admin-styles] input[type="week"],
[data-drupal-admin-styles] textarea,
[data-drupal-admin-styles] select {
  color: var(--gin-color-text, #222330);
  background-color: var(--gin-bg-input, #fff);
  border: 1px solid var(--gin-border-color-form-element, #8e929c);
  border-radius: var(--gin-border-m, .5rem);
  box-shadow: none;
  box-sizing: border-box;
  max-width: 100%;
  font-size: var(--gin-font-size-s, .875rem);
  line-height: 1.5;
  padding-block: .5rem;
  padding-inline: .75rem;
}

[data-drupal-admin-styles] input[type="text"],
[data-drupal-admin-styles] input[type="email"],
[data-drupal-admin-styles] input[type="tel"],
[data-drupal-admin-styles] input[type="url"],
[data-drupal-admin-styles] input[type="number"],
[data-drupal-admin-styles] input[type="search"],
[data-drupal-admin-styles] input[type="password"],
[data-drupal-admin-styles] input[type="date"],
[data-drupal-admin-styles] input[type="time"],
[data-drupal-admin-styles] input[type="datetime-local"],
[data-drupal-admin-styles] input[type="month"],
[data-drupal-admin-styles] input[type="week"],
[data-drupal-admin-styles] select {
  min-height: 2.5rem;
}

/* A legördülők Ginben a tartalomhoz igazodnak, nem teljes szélességűek. */
[data-drupal-admin-styles] select {
  width: auto;
  min-width: 12rem;
}

[data-drupal-admin-styles] textarea {
  min-height: 7rem;
  resize: vertical;
}

/* Fókusz – Gin dupla gyűrű */
[data-drupal-admin-styles] input[type="text"]:focus,
[data-drupal-admin-styles] input[type="email"]:focus,
[data-drupal-admin-styles] input[type="tel"]:focus,
[data-drupal-admin-styles] input[type="url"]:focus,
[data-drupal-admin-styles] input[type="number"]:focus,
[data-drupal-admin-styles] input[type="search"]:focus,
[data-drupal-admin-styles] input[type="password"]:focus,
[data-drupal-admin-styles] input[type="date"]:focus,
[data-drupal-admin-styles] input[type="time"]:focus,
[data-drupal-admin-styles] input[type="datetime-local"]:focus,
[data-drupal-admin-styles] input[type="month"]:focus,
[data-drupal-admin-styles] input[type="week"]:focus,
[data-drupal-admin-styles] textarea:focus,
[data-drupal-admin-styles] select:focus {
  outline: none;
  border-color: var(--gin-color-focus-border, rgba(0, 0, 0, .2));
  box-shadow:
    0 0 0 1px var(--gin-color-focus-border, rgba(0, 0, 0, .2)),
    0 0 0 4px var(--gin-color-focus, rgba(0, 125, 250, .6));
}

[data-drupal-admin-styles] input::placeholder,
[data-drupal-admin-styles] textarea::placeholder {
  color: var(--gin-color-text-light, #545560);
  opacity: .7;
}

[data-drupal-admin-styles] input:disabled,
[data-drupal-admin-styles] textarea:disabled,
[data-drupal-admin-styles] select:disabled {
  color: var(--gin-color-disabled, #767676);
  background-color: var(--gin-color-disabled-bg, #eaeaea);
  border-color: var(--gin-color-disabled-border, #c2c2c2);
  cursor: not-allowed;
}

/* Select – egységes Gin-chevron */
[data-drupal-admin-styles] select {
  appearance: none;
  -webkit-appearance: none;
  padding-inline-end: 2.25rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23545560' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 6 8 10 12 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem 1rem;
}

/* Autocomplete (pl. „Geocode address", „Probléma jellege") – Gin nagyító */
[data-drupal-admin-styles] input.form-autocomplete {
  padding-inline-end: 2.25rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23545560' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cline x1='10.5' y1='10.5' x2='14' y2='14'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem 1rem;
}

/* ------------------------------------------------------------
   3) Címkék, kötelező-jelölés, leírások
   ------------------------------------------------------------ */
[data-drupal-admin-styles] label:not(.form-check-label):not(.option) {
  display: inline-block;
  margin-bottom: .35rem;
  color: var(--gin-color-title, #222330);
  font-size: var(--gin-font-size-s, .875rem);
  font-weight: var(--gin-font-weight-bold, 575);
}

[data-drupal-admin-styles] .form-required::after,
[data-drupal-admin-styles] .form-required > .form-required__mark,
[data-drupal-admin-styles] abbr.required,
[data-drupal-admin-styles] .marker {
  color: var(--gin-color-danger, #cc3d3d);
}

[data-drupal-admin-styles] .description,
[data-drupal-admin-styles] .form-item__description {
  margin-top: .35rem;
  color: var(--gin-color-text-light, #545560);
  font-size: var(--gin-font-size-xs, .8125rem);
}

/* ------------------------------------------------------------
   4) Gombok
   - Elsődleges (kitöltött): CSAK valódi submit / elsődleges gomb.
   - Másodlagos: outline.
   - tabledrag „Sorok súlyának mutatása": halvány link (NEM fekete gomb!).
   ------------------------------------------------------------ */

/* Közös geometria (a tabledrag-toggle kivételével) */
[data-drupal-admin-styles] input[type="submit"],
[data-drupal-admin-styles] button[type="submit"],
[data-drupal-admin-styles] .button:not(.tabledrag-toggle-weight),
[data-drupal-admin-styles] .btn:not(.tabledrag-toggle-weight) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  border-radius: var(--gin-border-m, .5rem);
  padding-block: calc(.75rem - 2px);
  padding-inline: 1rem;
  font-size: var(--gin-font-size-s, .875rem);
  font-weight: var(--gin-font-weight-bold, 575);
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
}

/* Elsődleges (kitöltött) */
[data-drupal-admin-styles] input[type="submit"],
[data-drupal-admin-styles] button[type="submit"],
[data-drupal-admin-styles] .button--primary,
[data-drupal-admin-styles] .btn-primary {
  color: #fff;
  background-color: var(--gin-color-primary, #1b1b1d);
  border-color: var(--gin-color-primary, #1b1b1d);
  box-shadow: 0 1px 2px var(--gin-color-primary-light, rgba(0, 0, 0, .12));
}
[data-drupal-admin-styles] input[type="submit"]:hover,
[data-drupal-admin-styles] button[type="submit"]:hover,
[data-drupal-admin-styles] .button--primary:hover,
[data-drupal-admin-styles] .btn-primary:hover {
  background-color: var(--gin-color-primary-hover, #000);
  border-color: var(--gin-color-primary-hover, #000);
}
[data-drupal-admin-styles] input[type="submit"]:focus,
[data-drupal-admin-styles] button[type="submit"]:focus,
[data-drupal-admin-styles] .button--primary:focus,
[data-drupal-admin-styles] .btn-primary:focus {
  outline: none;
  box-shadow: 0 0 0 4px var(--gin-color-focus, rgba(0, 125, 250, .6));
}

/* Másodlagos / „outline" (pl. Eltávolítás) */
[data-drupal-admin-styles] .button:not(.button--primary):not(.tabledrag-toggle-weight),
[data-drupal-admin-styles] .btn:not(.btn-primary):not([type="submit"]):not(.tabledrag-toggle-weight) {
  color: var(--gin-color-primary, #1b1b1d);
  background-color: transparent;
  border-color: var(--gin-border-color-form-element, #8e929c);
}
[data-drupal-admin-styles] .button:not(.button--primary):not(.tabledrag-toggle-weight):hover,
[data-drupal-admin-styles] .btn:not(.btn-primary):not([type="submit"]):not(.tabledrag-toggle-weight):hover {
  border-color: var(--gin-color-primary, #1b1b1d);
}

/* tabledrag „Sorok súlyának mutatása" – halvány szöveges link */
[data-drupal-admin-styles] .tabledrag-toggle-weight,
[data-drupal-admin-styles] button.tabledrag-toggle-weight {
  appearance: none;
  -webkit-appearance: none;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
  color: var(--gin-color-text-light, #545560);
  font-size: var(--gin-font-size-xs, .8125rem);
  font-weight: var(--gin-font-weight-normal, 400);
  text-decoration: underline;
  cursor: pointer;
}
[data-drupal-admin-styles] .tabledrag-toggle-weight:hover {
  color: var(--gin-color-text, #222330);
}

/* ------------------------------------------------------------
   5) Egyszerű checkbox → Gin kapcsoló (toggle)
   Csak ÖNÁLLÓ checkboxra; a többértékű listákat (.form-checkboxes,
   .form-radios) és táblázatbeli checkboxokat kihagyjuk.
   ------------------------------------------------------------ */
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *)) {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  width: 2.5rem;
  height: 1.5rem;
  margin: 0 .5rem 0 0;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  background-color: var(--gin-color-disabled, #767676);
  border: 3px solid transparent;
  border-radius: 999px;
  flex: 0 0 auto;
}
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *))::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #fff;
  border-radius: 999px;
  transform: translateX(-16px);
}
@media (prefers-reduced-motion: no-preference) {
  [data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *))::before {
    transition: transform .3s;
  }
}
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *)):checked {
  background-color: var(--gin-switch, #26a769);
}
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *)):checked::before {
  transform: translateX(16px);
}
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *)):focus {
  outline: none;
  box-shadow:
    0 0 0 1px var(--gin-color-focus-border, rgba(0, 0, 0, .2)),
    0 0 0 4px var(--gin-color-focus, rgba(0, 125, 250, .6));
}
[data-drupal-admin-styles] input[type="checkbox"]:not(:where(.form-checkboxes *, .form-radios *, td *, th *, table *)):hover {
  opacity: .9;
}

[data-drupal-admin-styles] .form-check-label,
[data-drupal-admin-styles] label.option {
  font-weight: var(--gin-font-weight-normal, 400);
  color: var(--gin-color-text, #222330);
}

/* ------------------------------------------------------------
   6) Többértékű checkbox/radio – Gin akcentus a natív vezérlőn
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .form-checkboxes input[type="checkbox"],
[data-drupal-admin-styles] .form-radios input[type="radio"] {
  accent-color: var(--gin-color-primary, #1b1b1d);
  width: 1.1rem;
  height: 1.1rem;
}

/* ------------------------------------------------------------
   7) Fieldset / details / csoport-fejléc – finom Gin keret
   ------------------------------------------------------------ */
[data-drupal-admin-styles] fieldset,
[data-drupal-admin-styles] details {
  border: 1px solid var(--gin-border-color, #d4d4d8);
  border-radius: var(--gin-border-l, .75rem);
}
[data-drupal-admin-styles] legend,
[data-drupal-admin-styles] summary {
  color: var(--gin-color-title, #222330);
  font-weight: var(--gin-font-weight-bold, 575);
}

/* ------------------------------------------------------------
   8) Vízszintes fülek (field_group horizontal tabs) – Gin stílus
   Ez javítja az átfedést is: a fül-lista és a fül-tartalom közé
   térközt teszünk, és kioltjuk az esetleges float/abszolút pozíciót.
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .horizontal-tabs {
  position: static;
  margin: 0 0 1rem;
  border: 0;
  background: none;
  overflow: visible;
}

[data-drupal-admin-styles] .horizontal-tabs-list {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--gin-border-color, #d4d4d8);
  position: static;
  float: none;
  width: auto;
}

[data-drupal-admin-styles] .horizontal-tab-button {
  list-style: none;
  margin: 0;
  padding: 0;
  float: none;
}

[data-drupal-admin-styles] .horizontal-tab-button a,
[data-drupal-admin-styles] .horizontal-tab-button strong {
  display: block;
  padding: .5rem .85rem;
  color: var(--gin-color-text-light, #545560);
  font-size: var(--gin-font-size-s, .875rem);
  font-weight: var(--gin-font-weight-bold, 575);
  text-decoration: none;
  border: 0;
}

[data-drupal-admin-styles] .horizontal-tab-button a:hover {
  color: var(--gin-color-title, #222330);
}

[data-drupal-admin-styles] .horizontal-tab-button.selected a,
[data-drupal-admin-styles] .horizontal-tab-button.is-selected a,
[data-drupal-admin-styles] .horizontal-tab-button.selected strong,
[data-drupal-admin-styles] .horizontal-tab-button.is-selected strong {
  color: var(--gin-color-title, #222330);
}

/* A fül-tartalom (pane) kezdődjön a sáv alatt, ne lógjon rá. */
[data-drupal-admin-styles] .horizontal-tabs-panes {
  margin-top: 1rem;
  clear: both;
}

/* A pane-ok NE kapjanak fieldset/details keretet (lásd 7. szakasz). */
[data-drupal-admin-styles] details.horizontal-tabs-pane,
[data-drupal-admin-styles] .horizontal-tabs-pane {
  border: 0;
  border-radius: 0;
  padding-top: .5rem;
}

/* ============================================================
   9) Előfizetés details doboz + kártya-elrendezés
   ============================================================ */

/* A details summary-ja h2-stílusú, nem összecsukható vizuálisan
   (a nyíl eltávolítva, a kurzor alapértelmezett marad). */
[data-drupal-admin-styles] details summary {
  font-size: 1.25rem;
  font-weight: var(--gin-font-weight-bold, 575);
  color: var(--gin-color-title, #222330);
  padding: .75rem 1rem;
  list-style: none;
  cursor: default;
  pointer-events: none;
  border-bottom: 1px solid var(--gin-border-color, #d4d4d8);
  margin-bottom: 1rem;
}
[data-drupal-admin-styles] details summary::-webkit-details-marker {
  display: none;
}
[data-drupal-admin-styles] details summary::marker {
  content: none;
}

/* Details belső padding */
[data-drupal-admin-styles] details {
  padding: 0;
  margin: 1rem 0;
}
[data-drupal-admin-styles] details > :not(summary) {
  padding-inline: 1rem;
}
[data-drupal-admin-styles] details > :last-child {
  padding-bottom: 1rem;
}


/* Az .se-* stílusok a stripe_elofizetes/css/stripe_elofizetes.css-ben vannak,
   hogy mindkét témában (frontend + Gin admin) betöltődjenek. */

/* ============================================================
   10) PszichologusKereso arculat - Profil (listing) urlap
   ------------------------------------------------------------
   Marka-tokenek felulirasa, kartyas paragraph-sorok, Bootstrap 4
   -> 5 input-group javitas (Forint suffix), tisztabb tablazatok.
   Csak hozzafuzott blokk: a fenti 0-9. szakasz valtozatlan.
   ============================================================ */

/* ------------------------------------------------------------
   10.0) Marka-tokenek (feluliras a 0) szakasz ertekeihez kepest)
   ------------------------------------------------------------ */
[data-drupal-admin-styles] {
  --pk-brand: #5b9dc6;
  --pk-brand-hover: #497e9e;
  --pk-brand-dark: #33607f;
  --pk-brand-green: #7cc576;
  --pk-line: #dbe7f0;
  --pk-line-strong: #b9cfdf;
  --pk-surface: #f4f8fb;

  /* Elsodleges akcentus: marka kek (Mentes gomb, aktiv ful csikja,
     tobberteku checkbox accent, fokusz gyuru). */
  --gin-color-primary: #5b9dc6;
  --gin-color-primary-hover: #497e9e;
  --gin-color-primary-active: #33607f;
  --gin-color-primary-light: rgba(91, 157, 198, .16);
  --gin-color-primary-light-hover: rgba(91, 157, 198, .22);
  --gin-color-primary-light-active: rgba(91, 157, 198, .28);

  --gin-color-focus: rgba(91, 157, 198, .35);
  --gin-color-focus-border: #5b9dc6;

  --gin-color-title: #33607f;
  --gin-border-color: #dbe7f0;
  --gin-border-color-form-element: #b9cfdf;

  /* Kapcsolok (toggle) bekapcsolt allapota: marka zold. */
  --gin-switch: #7cc576;

  /* Az oldal betutipusa (self-hosted). */
  --pk-gin-font: Poppins, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ------------------------------------------------------------
   10.1) Az urlap-kartya lagyabb kerete es arnyeka
   ------------------------------------------------------------ */
[data-drupal-admin-styles] {
  border-color: var(--pk-line);
  box-shadow:
    0 1px 2px rgba(51, 96, 127, .04),
    0 6px 18px rgba(51, 96, 127, .06),
    0 18px 44px rgba(51, 96, 127, .05);
}

/* Cimsorok / mezocsoport-fejlecek marka-kek szoveggel. */
[data-drupal-admin-styles] legend,
[data-drupal-admin-styles] summary,
[data-drupal-admin-styles] .field-label,
[data-drupal-admin-styles] h4.label {
  color: var(--pk-brand-dark);
}

/* ------------------------------------------------------------
   10.2) Vizszintes fulek - marka akcentus
   Az aktiv ful 3px-es csikjat a gin-form.css a --gin-color-primary
   tokenbol rajzolja, azt a 10.0 mar marka kekre allitotta.
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .horizontal-tabs ul.horizontal-tabs-list li.horizontal-tab-button a:hover,
[data-drupal-admin-styles] .horizontal-tabs ul.horizontal-tabs-list li.horizontal-tab-button a:focus {
  color: var(--pk-brand-dark);
  background: var(--pk-surface);
}
[data-drupal-admin-styles] .horizontal-tabs ul.horizontal-tabs-list li.horizontal-tab-button.selected a {
  color: var(--pk-brand-dark);
  background: linear-gradient(180deg, rgba(91, 157, 198, .10), rgba(91, 157, 198, 0));
}

/* ------------------------------------------------------------
   10.3) "Szolgaltatasok" (field_highlights) - felirat nelkul,
   tobb oszlopos kapcsolo-racs
   ------------------------------------------------------------ */
[data-drupal-admin-styles] #edit-field-highlights--wrapper > legend {
  display: none;
}
[data-drupal-admin-styles] #edit-field-highlights--wrapper {
  margin-bottom: 1.25rem;
  padding: 1.1rem 1.25rem .35rem;
  background: var(--pk-surface);
  border-color: var(--pk-line);
}
[data-drupal-admin-styles] #edit-field-highlights {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 0 1.5rem;
}
[data-drupal-admin-styles] #edit-field-highlights .form-check {
  display: flex;
  align-items: center;
  padding-left: 0;
  margin-bottom: .75rem;
}
[data-drupal-admin-styles] #edit-field-highlights .form-check-label {
  margin: 0;
  cursor: pointer;
}

/* ------------------------------------------------------------
   10.4) Input-group (Bootstrap 4 markup Bootstrap 5 alatt)
   A Barrio ".input-group-append" wrappert ad ki, amit a BS5 mar
   nem stilizal - ezert esett kulon sorba a "Forint" suffix.
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .input-group {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
}
[data-drupal-admin-styles] .input-group > input,
[data-drupal-admin-styles] .input-group > .form-control {
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}
[data-drupal-admin-styles] .input-group > .input-group-append {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  margin-inline-start: -1px;
}
[data-drupal-admin-styles] .input-group > .input-group-prepend {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  margin-inline-end: -1px;
}
[data-drupal-admin-styles] .input-group .input-group-text {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0 .9rem;
  color: var(--pk-brand-dark);
  background-color: var(--pk-surface);
  border: 1px solid var(--gin-border-color-form-element, #b9cfdf);
  border-radius: 0 var(--gin-border-m, .5rem) var(--gin-border-m, .5rem) 0;
  font-size: var(--gin-font-size-s, .875rem);
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
}
[data-drupal-admin-styles] .input-group-prepend > .input-group-text {
  border-radius: var(--gin-border-m, .5rem) 0 0 var(--gin-border-m, .5rem);
}

/* ------------------------------------------------------------
   10.5) Tobberteku (paragraph) mezok - kartyas sorok
   ------------------------------------------------------------ */

/* A csikozas (table-striped) helyett atlatszo hatter. */
[data-drupal-admin-styles] table.field-multiple-table,
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr,
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr > td,
[data-drupal-admin-styles] table.field-multiple-table > thead > tr > th {
  background: transparent;
  border: 0;
  box-shadow: none;
}
[data-drupal-admin-styles] table.field-multiple-table {
  width: 100%;
  margin: 0;
}

/* A tobberteku tablazat korul ne legyen vizszintes gorgetosav. */
[data-drupal-admin-styles] .table-responsive:has(> table.field-multiple-table) {
  overflow: visible;
}

/* Ures fogd-es-vidd oszlop elrejtese (a fogantyu ugyis rejtve van). */
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr > td.field-multiple-drag {
  display: none;
}

/* A mezocsoport fejlece ("Oradijak / Arak", "Rendelo") */
[data-drupal-admin-styles] table.field-multiple-table > thead > tr > th.field-label {
  padding: 0 0 .75rem;
  border-bottom: 2px solid var(--pk-line);
}
[data-drupal-admin-styles] table.field-multiple-table > thead > tr > th.field-label h4.label {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: .01em;
}
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr > td {
  padding: 1rem 0 0;
  vertical-align: top;
}

/* Egy paragraph elem = egy kartya. */
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr > td > div[id$="-item-wrapper"] {
  background: #fff;
  border: 1px solid var(--pk-line);
  border-radius: .75rem;
  box-shadow: 0 1px 2px rgba(51, 96, 127, .05);
  overflow: hidden;
}
[data-drupal-admin-styles] table.field-multiple-table > tbody > tr > td > div[id$="-item-wrapper"] > div {
  margin-bottom: 0;
}

/* Kartya-fejlec: klasszikus (Oradijak / Arak) es elemi (Rendelo) widget. */
[data-drupal-admin-styles] .paragraph-type-top,
[data-drupal-admin-styles] .paragraph-top {
  margin: 0;
  padding: .7rem 1rem;
  background: var(--pk-surface);
  border-bottom: 1px solid var(--pk-line);
}
[data-drupal-admin-styles] .paragraph-type-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
[data-drupal-admin-styles] .paragraph-type-title,
[data-drupal-admin-styles] .paragraph-type-label {
  margin: 0;
  color: var(--pk-brand-dark);
  font-size: .875rem;
  font-weight: 600;
}
[data-drupal-admin-styles] .paragraph-summary .summary-content {
  color: var(--gin-color-text-light, #545560);
  font-size: .8125rem;
}
[data-drupal-admin-styles] .paragraphs-dropbutton-wrapper {
  margin: 0;
}

/* Kartya-torzs. */
[data-drupal-admin-styles] .paragraphs-subform {
  margin: 0;
  padding: 1.15rem 1rem .35rem;
}

/* "Rendelo hozzaadasa" / "Oradijak / Arak hozzaadasa" sav. */
[data-drupal-admin-styles] .paragraphs-add-wrapper,
[data-drupal-admin-styles] .field-add-more-submit {
  margin-top: 1rem;
}

/* ------------------------------------------------------------
   10.6) Belso tablazatok (rendelesi ido, kepfeltoltes)
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .paragraphs-subform table {
  width: 100%;
  margin: 0;
  border: 1px solid var(--pk-line);
  border-radius: .6rem;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}
[data-drupal-admin-styles] .paragraphs-subform table > thead > tr > th {
  padding: .55rem .75rem;
  background: var(--pk-surface);
  border-bottom: 1px solid var(--pk-line);
  color: var(--pk-brand-dark);
  font-size: .8125rem;
  font-weight: 600;
  white-space: nowrap;
}
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr > th,
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr > td {
  padding: .45rem .75rem;
  background: transparent;
  border-top: 1px solid var(--pk-line);
  vertical-align: middle;
}
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr:first-child > th,
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr:first-child > td {
  border-top: 0;
}
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr:nth-child(even) > th,
[data-drupal-admin-styles] .paragraphs-subform table > tbody > tr:nth-child(even) > td {
  background: rgba(91, 157, 198, .04);
}
[data-drupal-admin-styles] .office-hours-label {
  font-weight: 500;
}
[data-drupal-admin-styles] .paragraphs-subform table .form-item,
[data-drupal-admin-styles] .paragraphs-subform table .js-form-item {
  margin-bottom: 0;
}
[data-drupal-admin-styles] .paragraphs-subform table select,
[data-drupal-admin-styles] .paragraphs-subform table input[type="time"],
[data-drupal-admin-styles] .paragraphs-subform table input[type="text"] {
  min-width: 0;
  width: 100%;
}

/* Rendelesi ido: a muveleti linkek halvany szoveges linkek legyenek. */
[data-drupal-admin-styles] .office-hours-more-link,
[data-drupal-admin-styles] .paragraphs-subform table td a {
  color: var(--pk-brand);
  font-size: .8125rem;
  text-decoration: none;
}
[data-drupal-admin-styles] .paragraphs-subform table td a:hover {
  color: var(--pk-brand-hover);
  text-decoration: underline;
}

/* ------------------------------------------------------------
   10.7) Gombok - marka kek elsodleges, lagy kontur masodlagos
   ------------------------------------------------------------ */
[data-drupal-admin-styles] .form-actions {
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--pk-line);
}
[data-drupal-admin-styles] .form-actions input[type="submit"],
[data-drupal-admin-styles] .form-actions .button--primary {
  border-radius: .6rem;
  box-shadow: 0 2px 6px rgba(91, 157, 198, .32);
}
[data-drupal-admin-styles] .button:not(.button--primary):not(.tabledrag-toggle-weight):hover,
[data-drupal-admin-styles] .btn:not(.btn-primary):not([type="submit"]):not(.tabledrag-toggle-weight):hover {
  color: var(--pk-brand-dark);
  background-color: var(--pk-surface);
  border-color: var(--pk-brand);
}

/* ------------------------------------------------------------
   10.8) Mobil
   ------------------------------------------------------------ */
@media (max-width: 767.98px) {
  [data-drupal-admin-styles] {
    padding: 1.1rem 1rem;
    border-radius: .6rem;
  }
  [data-drupal-admin-styles] #edit-field-highlights {
    grid-template-columns: 1fr;
  }
  [data-drupal-admin-styles] .paragraphs-subform {
    padding-inline: .65rem;
  }
  [data-drupal-admin-styles] .table-responsive:has(> table.field-multiple-table) {
    overflow-x: auto;
  }
}

/* ==========================================================================
   11) SZEMELYES UZENET URLAP (/user/{uid}/contact) - gombsav (2026-09)
   --------------------------------------------------------------------------
   Az urlap Gin-kartyat kap (lasd a modul contact_message_personal hookjat).
   A koszono_oldalak modul viszont sajat, teljes szelessegu, egymas ala
   tordelt gombokat adott neki - az a Blog bekuldese lap gombsavatol elter.

   A koszono.css-t NEM modositjuk: azok a szabalyok mashol is elhetnek. Ehelyett
   itt, nagyobb specifikussaggal allitjuk vissza a Gin-gombsavot - az
   attributum-szelektor miatt ezek a szabalyok gyoznek (4 osztaly 3 ellen).

   EGY VONALBAN
   A ket gomb kozul az egyik <input type="submit">, a masik <a>. A magassaguk
   a belso terkozbol adodott, ezert par pixellel eltert - igy nem alltak egy
   vonalban. Ezert a gombsav flex, fuggoleges kozepre igazitassal, es mindket
   gomb UGYANAZT a min-height erteket kapja. Ez akkor is all, ha a felirat
   hossza vagy a betumeret kesobb valtozik - nem pixelre beallitott ertek.
   ========================================================================== */

[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--pk-line, #dbe7f0);
}

/* A ket gomb kozos merete. A min-height es a box-sizing a lenyeg: ettol lesz
   a ket, kulonbozo elemtipus pontosan egyforma magas. */
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions input[type="submit"],
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb,
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-height: 2.75rem !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding-block: 0 !important;
  padding-inline: 1.5rem !important;
  border: 2px solid transparent !important;
  border-radius: .6rem !important;
  font-size: var(--gin-font-size-s, .875rem) !important;
  font-weight: var(--gin-font-weight-bold, 575) !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  vertical-align: middle !important;
}

/* Elsodleges gomb: marka kek, mint a Blog lap "Mentes" gombja. */
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions input[type="submit"],
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--elsodleges {
  background-color: var(--pk-brand, #5b9dc6) !important;
  border-color: var(--pk-brand, #5b9dc6) !important;
  box-shadow: 0 2px 6px rgba(91, 157, 198, .32) !important;
  color: #ffffff !important;
}

[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions input[type="submit"]:hover,
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions input[type="submit"]:focus,
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--elsodleges:hover,
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--elsodleges:focus {
  background-color: var(--pk-brand-hover, #497e9e) !important;
  border-color: var(--pk-brand-hover, #497e9e) !important;
  color: #ffffff !important;
}

/* Masodlagos gomb: konturos, mint a Gin masodlagos gombja. */
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--masodlagos {
  background-color: transparent !important;
  border-color: var(--gin-border-color-form-element, #b9cfdf) !important;
  box-shadow: none !important;
  color: var(--pk-brand-dark, #33607f) !important;
}

[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--masodlagos:hover,
[data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb--masodlagos:focus {
  background-color: var(--pk-surface, #f4f8fb) !important;
  border-color: var(--pk-brand, #5b9dc6) !important;
  color: var(--pk-brand-dark, #33607f) !important;
}

/* Mobilon egymas ala, teljes szelessegben - ott az a kenyelmes. */
@media (max-width: 575.98px) {
  [data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions {
    flex-direction: column;
    align-items: stretch;
  }

  [data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions input[type="submit"],
  [data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .pk-gomb,
  [data-drupal-admin-styles].pk-szemelyes-kapcsolat .form-actions .button {
    width: 100% !important;
  }
}

/* ==========================================================================
   12) BELEPES/REGISZTRACIO FULEK - a profiloldal fuleinek kinezete (2026-09)
   --------------------------------------------------------------------------
   A Bejelentkezes / Regisztracio / Elfelejtettem a jelszavam fulek a Drupal
   HELYI FULEI; a sminknek nincs rajuk sajat sablonja, ezert Bootstrap-fulkent
   rajzolodnak ki (dobozos aktiv ful). A profiloldal fulei ezzel szemben a
   node--listing--full.html.twig <style> blokkjabol kapjak a stilusukat.

   Az itteni ertekek ONNAN valok, nem becsulve:
     also vonal  #dde6ee 1px      aktiv csik   #5b9dc6 3px
     szoveg      #545560 700      aktiv szoveg #33607f
     terkoz      .7rem 1rem       aktiv hatter #f0f6fa
     meret       .95rem           hover hatter #f3f8fc

   A hatokort a body pk-belepes-oldal osztalya zarja le (lasd a modul
   preprocess_html hookjat), hogy a webhely tobbi fulet ne erintse.

   Az !important azert kell, mert a dobozos ful-kinezet nem ebbol a sminkbol
   jon, hanem az alaptemabol/magbol - azt osztallyal nem tudjuk biztosan
   legyozni.
   ========================================================================== */

body.pk-belepes-oldal ul.tabs,
body.pk-belepes-oldal ul.primary,
body.pk-belepes-oldal ul.nav-tabs {
  display: flex !important;
  flex-wrap: nowrap;
  gap: 0.15rem;
  list-style: none;
  margin: 0 0 1.25rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #dde6ee !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

body.pk-belepes-oldal ul.tabs::-webkit-scrollbar,
body.pk-belepes-oldal ul.primary::-webkit-scrollbar,
body.pk-belepes-oldal ul.nav-tabs::-webkit-scrollbar {
  display: none;
}

body.pk-belepes-oldal ul.tabs > li,
body.pk-belepes-oldal ul.primary > li,
body.pk-belepes-oldal ul.nav-tabs > li {
  flex: 0 0 auto;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.pk-belepes-oldal ul.tabs > li > a,
body.pk-belepes-oldal ul.primary > li > a,
body.pk-belepes-oldal ul.nav-tabs > li > a {
  display: block !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  background: transparent !important;
  color: #545560 !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  line-height: 1.2 !important;
  padding: 0.7rem 1rem !important;
  margin-bottom: -1px !important;
  white-space: nowrap;
  text-decoration: none !important;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

body.pk-belepes-oldal ul.tabs > li > a:hover,
body.pk-belepes-oldal ul.tabs > li > a:focus,
body.pk-belepes-oldal ul.primary > li > a:hover,
body.pk-belepes-oldal ul.primary > li > a:focus,
body.pk-belepes-oldal ul.nav-tabs > li > a:hover,
body.pk-belepes-oldal ul.nav-tabs > li > a:focus {
  color: #33607f !important;
  background-color: #f3f8fc !important;
  outline: none;
}

/* Az aktiv fulet a smink tobbfele osztallyal is jelolheti (is-active, active,
   aria-current) - mindegyiket lefedjuk, hogy biztosan fogjon. */
body.pk-belepes-oldal ul.tabs > li > a.is-active,
body.pk-belepes-oldal ul.tabs > li > a.active,
body.pk-belepes-oldal ul.tabs > li.active > a,
body.pk-belepes-oldal ul.tabs > li.is-active > a,
body.pk-belepes-oldal ul.primary > li > a.is-active,
body.pk-belepes-oldal ul.primary > li.active > a,
body.pk-belepes-oldal ul.nav-tabs > li > a.is-active,
body.pk-belepes-oldal ul.nav-tabs > li > a.active,
body.pk-belepes-oldal ul.nav-tabs > li.active > a,
body.pk-belepes-oldal ul.tabs > li > a[aria-current="page"],
body.pk-belepes-oldal ul.nav-tabs > li > a[aria-current="page"] {
  background-color: #f0f6fa !important;
  color: #33607f !important;
  border-bottom-color: #5b9dc6 !important;
}

/* A "Primary tabs" rejtett cimsort a core kiirja - itt nem kell hely neki. */
body.pk-belepes-oldal nav.tabs > h2 {
  position: absolute;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  width: 1px;
  height: 1px;
}

/* Mobilon a fulek TORDELODJENEK, hogy mind latszodjon - ugyanugy, mint a
   profiloldalon. */
@media (max-width: 767px) {
  body.pk-belepes-oldal ul.tabs,
  body.pk-belepes-oldal ul.primary,
  body.pk-belepes-oldal ul.nav-tabs {
    flex-wrap: wrap;
    overflow-x: visible;
    row-gap: 0;
    column-gap: 0.15rem;
    margin-bottom: 1rem !important;
  }

  body.pk-belepes-oldal ul.tabs > li > a,
  body.pk-belepes-oldal ul.primary > li > a,
  body.pk-belepes-oldal ul.nav-tabs > li > a {
    font-size: 0.9rem !important;
    padding: 0.55rem 0.7rem !important;
  }
}

/* ==========================================================================
   13) UZENET-URLAP TAJEKOZTATO DOBOZ (2026-09)
   --------------------------------------------------------------------------
   Az "Uzenet irasa" lap tetejen allo kek doboz: az uzenet csak a cimzetthez
   jut el, a webhely nem tarolja.

   A stilus a webhely markakekjere epul (#5b9dc6 jelolosav, #33607f szoveg),
   ugyanugy, ahogy a lap tobbi eleme. A szabalyok itt vannak, mert ez a fajl
   amugy is betoltodik ezen az urlapon a Gin-kartyaval egyutt - igy nem kell
   uj konyvtarat felvenni egyetlen dobozert.
   ========================================================================== */

.pk-uzenet-info {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border-left: 4px solid #5b9dc6;
  border-radius: 0 .5rem .5rem 0;
  background-color: #eef5fb;
}

.pk-uzenet-info__ikon {
  flex: 0 0 auto;
  margin-top: .15rem;
}

.pk-uzenet-info__szoveg {
  color: #33607f;
  font-size: .9375rem;
  font-weight: 400;
  line-height: 1.55;
}

.pk-uzenet-info__szoveg strong {
  font-weight: 700;
}

@media (max-width: 575.98px) {
  .pk-uzenet-info {
    padding: .85rem .95rem;
  }

  .pk-uzenet-info__szoveg {
    font-size: .9rem;
  }
}

/* ============================================================
   11) PK-URLAP-EGYSEG — a két nyilvános hozzáadó-űrlap egységesítése
   ------------------------------------------------------------
   MIÉRT KELL, és miért ilyen erős a szelektor:

   A bizreview theme.css a gin-bridge.css UTÁN tölt be, és
   azonos erősséggel (0,1,0) felülírja a fenti 1) szakasz
   kártya-térközét:
       .node-form { padding: 80px 0; }
   A custom.css pedig ezt csak az Ajánlatkérésnél húzza vissza
   nullára, erősebb szelektorral (0,2,0):
       .node-offer-request-form.node-form { padding-top: 0; }
   Így lett az egyik űrlap tetején 80px, a másikén 0px.

   Az alábbi szelektorok erőssége 0,2,1 (elemnév + osztály +
   attribútum), ezért mindkét fenti szabályt verik. Az
   [data-drupal-admin-styles] attribútumot csak a gin-stílust
   kapott ÚJ, nyilvános űrlapok kapják meg, a szerkesztő-
   űrlapok nem — így ez a blokk semmilyen más oldalra nem hat.
   ============================================================ */

/* Azonos kártyateteje mindkét űrlapnak. */
form.node-psychologist-answer-form[data-drupal-admin-styles],
form.node-offer-request-form[data-drupal-admin-styles] {
  padding-top: 1.75rem;
}

/* A címke MINDIG a mező fölött álljon — a legördülőknél is.
   A gin-bridge 3) szakasza inline-block címkét ad, a select
   pedig width:auto, ezért ültek egy sorba (Vármegye,
   Problémakör kiválasztása). A jelölőnégyzet/rádió címkéje
   marad a vezérlő mellett. */
form.node-psychologist-answer-form[data-drupal-admin-styles] label:not(.form-check-label):not(.option),
form.node-offer-request-form[data-drupal-admin-styles] label:not(.form-check-label):not(.option) {
  display: block;
}

@media (max-width: 767.98px) {
  form.node-psychologist-answer-form[data-drupal-admin-styles],
  form.node-offer-request-form[data-drupal-admin-styles] {
    padding-top: 1.1rem;
  }
}

/* ==========================================================================
   PK-ADMIN-GOMBOK — az /admin/people tömeges műveletei (append, 2026-09-23)
   --------------------------------------------------------------------------
   A legördülő helyett csoportosított gombsorok. A csoportcím viszi az
   előtagot ("Szerepkör megadása"), a gombon csak a megkülönböztető rész
   marad, így hét gomb is elfér egy sorban.
   ========================================================================== */

.pk-muvelet-sav {
  display: flex;
  flex-direction: column;
  gap: .85rem;
  margin: 0 0 1rem;
}

.pk-muvelet-csoport {
  border: 1px solid rgba(0, 0, 0, .12);
  border-radius: .6rem;
  padding: .7rem .9rem .9rem;
  background: rgba(0, 0, 0, .015);
}

.pk-muvelet-csoport__cim {
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  opacity: .65;
  margin: 0 0 .55rem;
}

.pk-muvelet-csoport__gombok {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.pk-muvelet-gomb {
  margin: 0 !important;
}

/* A veszélyes muveletek: fiok megszuntetese, adminisztratori jog. */
.pk-muvelet-gomb--veszelyes {
  border-color: #b3261e !important;
  color: #b3261e !important;
  background-color: transparent !important;
  background-image: none !important;
}

.pk-muvelet-gomb--veszelyes:hover,
.pk-muvelet-gomb--veszelyes:focus {
  background-color: #b3261e !important;
  color: #fff !important;
}

@media (max-width: 767.98px) {
  .pk-muvelet-csoport__gombok {
    gap: .4rem;
  }
  .pk-muvelet-gomb {
    flex: 1 1 100%;
  }
}

/* ==========================================================================
   PK-ADMIN-GOMBOK-SZIN — a gombsorok színei (append, 2026-09-23)
   --------------------------------------------------------------------------
   1. A csoportcímek fehérek voltak a világos háttéren, mert az előző
      blokkban csak opacity szerepelt, szín nem — így a Gintol orokolt
      feher maradt. A Gin sajat valtozojat hasznaljuk, hogy sotet modban
      is jo legyen; a tartalek ertek vilagos hatterre valo.

   2. A veszelyes gombok: tomor piros hatter, feher szoveg. Igy elso
      pillantasra latszik, hogy ezek mas termeszetuek.
   ========================================================================== */

.pk-muvelet-csoport__cim {
  color: var(--gin-color-text, #32444e) !important;
  opacity: 1 !important;
}

.pk-muvelet-csoport {
  border-color: var(--gin-border-color, rgba(0, 0, 0, .14)) !important;
}

.pk-muvelet-gomb--veszelyes,
.pk-muvelet-gomb--veszelyes.button,
.pk-muvelet-gomb--veszelyes.form-submit {
  background-color: #b3261e !important;
  background-image: none !important;
  border-color: #b3261e !important;
  color: #fff !important;
}

.pk-muvelet-gomb--veszelyes:hover,
.pk-muvelet-gomb--veszelyes:focus,
.pk-muvelet-gomb--veszelyes.button:hover,
.pk-muvelet-gomb--veszelyes.button:focus {
  background-color: #8c1d18 !important;
  border-color: #8c1d18 !important;
  color: #fff !important;
}

.pk-muvelet-gomb--veszelyes:focus-visible {
  outline: 2px solid #8c1d18 !important;
  outline-offset: 2px !important;
}