/*
 * Alap: a korábbi bootstrap5 base theme-ből ténylegesen használt értékek
 * (reboot, container, form, gomb, pager, üzenetek), Bootstrap nélkül.
 */
:root {
  --gbd_font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --gbd_text: #212529;
  --gbd_link: #0d6efd;
  --gbd_link_hover: #0a58ca;
  --gbd_border: #dee2e6;
  --gbd_radius: .375rem;
  --gbd_btn: #6c757d;
  --gbd_btn_primary: #0d6efd;
  --gbd_focus: 0 0 0 .25rem rgb(13 110 253 / .25);
}

/* reboot */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  margin: 0;
  font-family: var(--gbd_font);
  font-size: 1rem;
  line-height: 1.5;
  color: var(--gbd_text);
  background-color: #fff;
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
}

/* a Bootstrap RFS értékei: 1200px alatt a vw-vel skáláz, felette fix */
h1 { font-size: calc(1.375rem + 1.5vw); }
h2 { font-size: calc(1.325rem + .9vw); }
h3 { font-size: calc(1.3rem + .6vw); }
h4 { font-size: calc(1.275rem + .3vw); }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }

@media (min-width: 1200px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.75rem; }
  h4 { font-size: 1.5rem; }
}

p,
ol,
ul,
dl,
blockquote {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol,
ul {
  padding-left: 2rem;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: 700;
}

dd {
  margin-bottom: .5rem;
  margin-left: 0;
}

b,
strong {
  font-weight: bolder;
}

small {
  font-size: .875em;
}

a {
  color: var(--gbd_link);
  text-decoration: underline;

  &:hover {
    color: var(--gbd_link_hover);
  }
}

img,
svg {
  vertical-align: middle;
}

img {
  max-width: 100%;
  height: auto;
}

hr {
  margin: 1rem 0;
  color: inherit;
  border: 0;
  border-top: 1px solid;
  opacity: .25;
}

table {
  border-collapse: collapse;
}

label {
  display: inline-block;
}

button,
input,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* container: a Bootstrap töréspontjai */
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: .75rem;
  padding-left: .75rem;
}

@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

/* form */
.form-item,
.form-actions {
  margin-top: 1em;
  margin-bottom: 1em;
}

.form-checkboxes .form-item,
.form-radios .form-item {
  margin-top: .4em;
  margin-bottom: .4em;
}

.form-item .description,
.form-composite > .fieldset-wrapper > .description {
  font-size: .85em;
}

/* háttérképes csillag, hogy a felolvasó ne mondja be */
.form-required::after {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 .3em;
  vertical-align: super;
  content: "";
  background: url(../img/required.svg) no-repeat 0 0 / 6px 6px;
}

label.option {
  display: inline;
  font-weight: normal;
}

fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

legend {
  float: left;
  width: 100%;
  margin-bottom: .5rem;
  padding: 0;
  font-size: inherit;

  & + * {
    clear: left;
  }
}

.form-composite > legend {
  margin-bottom: 0;
  font-weight: bold;
}

/* előtag / utótag (pl. „év”) a mező mellett, ne alatta */
.form-item:has(> .field-prefix, > .field-suffix) {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;

  > label,
  > .description {
    width: 100%;
  }

  > input {
    flex: 1;
    width: auto;
    min-width: 0;
  }
}

.field-prefix,
.field-suffix {
  display: flex;
  align-items: center;
  padding: .375rem .75rem;
  white-space: nowrap;
  background-color: #f8f9fa;
  border: 1px solid var(--gbd_border);
  border-radius: var(--gbd_radius);
}

input:is([type=text], [type=email], [type=tel], [type=number], [type=search], [type=password], [type=url], [type=date], [type=time]),
select,
textarea {
  display: block;
  width: 100%;
  padding: .375rem .75rem;
  color: var(--gbd_text);
  background-color: #fff;
  border: 1px solid var(--gbd_border);
  border-radius: var(--gbd_radius);

  &:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: var(--gbd_focus);
  }
}

/* a korábbi .form-check-input: saját rajzolású doboz, hogy a téma border színe érvényesüljön */
input:is([type=checkbox], [type=radio]) {
  flex-shrink: 0;
  width: 1em;
  height: 1em;
  margin: .25em .5em 0 0;
  vertical-align: top;
  appearance: none;
  background: #fff no-repeat center / contain;
  border: 1px solid var(--gbd_border);
  print-color-adjust: exact;

  &:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: var(--gbd_focus);
  }

  &:checked {
    background-color: var(--gbd_btn_primary);
    border-color: var(--gbd_btn_primary);
  }

  &:disabled {
    opacity: .5;
  }
}

input[type=checkbox] {
  border-radius: .25em;

  &:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
  }
}

input[type=radio] {
  border-radius: 50%;

  &:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
  }
}

/* checkbox / radio sor: a korábbi .form-check méretei (behúzás, kis alsó margó) */
.form-type-checkbox,
.form-type-radio {
  min-height: 1.5rem;
  margin-bottom: .125rem;
  padding-left: 1.5em;

  > input {
    float: left;
    margin: .25em 0 0 -1.5em;
  }
}

/* gomb */
.button,
.form-submit {
  display: inline-block;
  padding: .375rem .75rem;
  color: #fff;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  background-color: var(--gbd_btn);
  border: 1px solid var(--gbd_btn);
  border-radius: var(--gbd_radius);

  &:hover {
    color: #fff;
    background-color: color-mix(in srgb, var(--gbd_btn) 85%, #000);
  }

  &:focus-visible {
    outline: 0;
    box-shadow: var(--gbd_focus);
  }
}

.button--primary {
  background-color: var(--gbd_btn_primary);
  border-color: var(--gbd_btn_primary);

  &:hover {
    background-color: color-mix(in srgb, var(--gbd_btn_primary) 85%, #000);
  }
}

/* a core container-inline.module.css megadja az inline-block-ot; a kettőspont és a gombsor margója innen jön */
.container-inline label::after {
  content: ":";
}

.form-type-radios .container-inline label::after,
.form-type-checkboxes .container-inline label::after {
  content: "";
}

/* kereső oldal: mező és gomb egy sorban, függőleges margó nélkül */
.search-form .container-inline .form-item {
  margin: 0;
}

.search-form .container-inline .form-submit {
  margin-left: .5rem;
}

.container-inline .form-actions,
.container-inline.form-actions {
  margin-top: 0;
  margin-bottom: 0;
}

/* field */
.field__label {
  font-weight: bold;
}

.field--label-inline .field__label,
.field--label-inline .field__items {
  float: left;
  padding-right: .5em;
}

/* pager (core pager.html.twig) */
.pager__items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1rem 0;
  list-style: none;
}

.pager__item a {
  display: block;
  margin-left: -1px;
  padding: .375rem .75rem;
  color: var(--gbd_link);
  text-decoration: none;
  border: 1px solid var(--gbd_border);

  &:hover {
    background-color: #f8f9fa;
  }
}

.pager__item:first-child a {
  border-radius: var(--gbd_radius) 0 0 var(--gbd_radius);
}

.pager__item:last-child a {
  border-radius: 0 var(--gbd_radius) var(--gbd_radius) 0;
}

.pager__item.is-active a {
  color: #fff;
  background-color: var(--gbd_btn_primary);
  border-color: var(--gbd_btn_primary);
}

/* üzenetek (core status-messages.html.twig) */
.messages {
  margin-bottom: 1rem;
  padding: 1rem;
  border: 1px solid;
  border-left-width: .5rem;
  border-radius: var(--gbd_radius);
}

.messages__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.messages--status {
  color: #325e1c;
  background-color: #f3faef;
  border-color: #77b259;
}

.messages--warning {
  color: #734c00;
  background-color: #fdf8ed;
  border-color: #e09600;
}

.messages--error {
  color: #a51b00;
  background-color: #fcf4f2;
  border-color: #e62600;
}

.node--unpublished {
  background-color: #fff4f4;
}

/* item-list (core item-list.html.twig), pl. keresési találatok */
.item-list ul {
  margin: 0 0 .75em;
  padding: 0;
}

.item-list li {
  margin: 0 0 .25em 1.5em;
  padding: 0;
}

.search-results {
  list-style: none;
}

/* tartalomban (Top info blokk) használt egyetlen utility: 576px felett rejt */
@media (min-width: 576px) {
  .d-sm-none {
    display: none;
  }
}

/* régiók és footer (a korábbi bootstrap5 téma-szabályai) */
.region-content,
.region-footer {
  padding: 0 .5rem;
}

footer {
  padding: 2rem 0;
}

footer .region-footer {
  display: flex;
  flex-direction: column;
}

/* szerkesztői tabok (core menu-local-tasks) */
.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--gbd_border);

  a {
    display: block;
    padding: .5rem 1rem;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: var(--gbd_radius) var(--gbd_radius) 0 0;
  }

  .is-active a,
  a.is-active {
    color: var(--gbd_text);
    background-color: #fff;
    border-color: var(--gbd_border) var(--gbd_border) #fff;
  }
}

/* a core clearfix display: table-t használ, ami bent tartja az utolsó bekezdés margóját;
   a Bootstrap block értékével a margó kicsúszik, a layout erre épült */
.clearfix::after {
  display: block;
}