:root,
[data-bs-theme] {
  --nalezny-content-max-width: 1200px;
  --nalezny-content-gutter: 18px;
  --bs-link-color: var(--nalezny-navy, #1b3049);
  --bs-link-color-rgb: 27, 48, 73;
  --bs-link-hover-color: var(--nalezny-navy-dark, #12233a);
  --bs-link-hover-color-rgb: 18, 35, 58;
}

#header > .nalezny-header__inner,
#wrapper .breadcrumb__wrapper > .container,
#wrapper > .columns-container.container,
#footer .container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--nalezny-content-max-width);
  margin-inline: auto;
  padding-inline: var(--nalezny-content-gutter);
}

/* SimpleCMS loads its front.css after this file, so use a scoped selector to
   keep article and category content aligned with the site header. */
#wrapper .simplecms-category,
#wrapper .simplecms-article-detail {
  padding-inline: 0;
}

a {
  color: var(--nalezny-navy, #1b3049);
}

a:hover {
  color: var(--nalezny-navy-dark, #12233a);
}

#wrapper {
  background: var(--nalezny-mint, #eef6f0);
}

.btn.btn-primary {
  background: var(--nalezny-navy, #1b3049);
  border-color: var(--nalezny-navy, #1b3049);
  color: #fff;
}

/* The same compact contact panel appears on every storefront page. */
.nalezny-subpage-hero {
  margin: 0px 0 24px;
  padding-top: 24px;
}

.nalezny-subpage-hero__inner {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px;
  width: calc(100% - 2 * var(--nalezny-content-gutter));
  max-width: var(--nalezny-content-max-width);
  margin-inline: auto;
  padding: 18px 22px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .52);
}

.nalezny-subpage-hero__portrait {
  display: block;
  width: 108px;
  height: 108px;
  overflow: hidden;
  border-radius: 10px;
  background: #dfe9e2;
}

.nalezny-subpage-hero__portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nalezny-subpage-hero__title {
  margin: 0 0 6px;
  color: var(--nalezny-navy);
  font-size: clamp(1.45rem, 2.4vw, 1.9rem);
  font-weight: 700;
  line-height: 1.2;
}

.nalezny-subpage-hero__lead {
  margin: 0;
  color: var(--nalezny-navy);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
}

.nalezny-subpage-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}

.nalezny-subpage-hero__actions .nalezny-button {
  min-height: 42px;
  padding: 10px 14px;
  font-size: .94rem;
  white-space: nowrap;
}

@media (max-width: 1000px) {
  .nalezny-subpage-hero__inner {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 14px 18px;
    padding: 16px 18px;
  }

  .nalezny-subpage-hero__portrait {
    width: 92px;
    height: 92px;
  }

  .nalezny-subpage-hero__actions {
    grid-column: 2;
  }
}

@media (max-width: 767px) {
  .nalezny-subpage-hero__inner {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
  }

  .nalezny-subpage-hero__portrait {
    width: 82px;
    height: 82px;
  }

  .nalezny-subpage-hero__title {
    font-size: 1.25rem;
  }

  .nalezny-subpage-hero__lead {
    font-size: .9rem;
  }

  .nalezny-subpage-hero__actions {
    grid-column: 1 / -1;
  }

  .nalezny-subpage-hero__actions .nalezny-button {
    flex: 1 1 145px;
    padding-inline: 10px;
    white-space: normal;
    text-align: center;
  }
}

.breadcrumb__wrapper {
  /* background-color: var(--bs-tertiary-bg); */
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .breadcrumb__wrapper {
    margin-bottom: 0rem;
  }
}
/* Keep the brand and phone on the first header row, with navigation below. */
@media (min-width: 1200px) {
  #header > .nalezny-header__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
      "brand phone language"
      "menu menu menu";
    align-items: center;
    column-gap: 1rem;
    row-gap: .35rem;
    padding-block: .55rem;
  }

  #header .nalezny-header__actions {
    display: contents;
  }

  #header .nalezny-brand {
    grid-area: brand;
    font-size: .92rem;
  }

  #header .nalezny-header__phone {
    grid-area: phone;
    justify-self: end;
    white-space: nowrap;
  }

  #header .nalezny-header__actions > .ps-mainmenu--desktop {
    grid-area: menu;
    position: static;
    width: max-content;
    justify-self: center;
    transform: none;
  }

  #header .nalezny-language-selector {
    grid-area: language;
    justify-self: end;
  }

  #header .ps-mainmenu__tree > li .ps-mainmenu__tree-link {
    padding-inline: .375rem;
  }

  #header .ps-mainmenu__tree {
    justify-content: center;
  }
}

@media (min-width: 576px) and (max-width: 1199.98px) {
  #header > .nalezny-header__inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-block: .6rem;
  }

  #header .nalezny-header__actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    flex: 0 0 auto;
  }

  #header .nalezny-brand {
    max-width: none;
    white-space: nowrap;
  }

  #header .nalezny-header__phone {
    order: 0;
    white-space: nowrap;
  }

  #header .nalezny-header__actions > .ps-mainmenu--desktop {
    order: 1;
    flex: 0 0 auto;
  }

  #header .nalezny-language-selector {
    order: 2;
  }
}

@media (max-width: 575.98px) {
  #header > .nalezny-header__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
      "brand brand brand"
      "phone menu language";
    align-items: center;
    column-gap: .65rem;
    row-gap: .4rem;
    padding-block: .65rem;
  }

  #header .nalezny-header__actions {
    display: contents;
  }

  #header .nalezny-brand {
    grid-area: brand;
    max-width: 100%;
    font-size: 1rem;
    line-height: 1.25;
  }

  #header .nalezny-header__phone {
    grid-area: phone;
    justify-self: end;
    white-space: nowrap;
  }

  #header .nalezny-header__actions > .ps-mainmenu--desktop {
    grid-area: menu;
    position: static;
    justify-self: end;
    order: 0;
    flex: 0 0 auto;
  }

  #header .nalezny-language-selector {
    grid-area: language;
    justify-self: end;
  }
}

@layer utilities {
  @media (min-width: 1200px) {
    #header .ps-mainmenu__desktop.d-none {
      display: block !important;
    }

    #header .ps-mainmenu__mobile-toggle.d-flex {
      display: none !important;
    }
  }
}
#mobileMenu .ps-mainmenu__additionnals {
  flex: 1 1 auto;
  min-height: 0;
  align-content: flex-start;
  align-items: flex-start !important;
}

#mobileMenu .ps-mainmenu__mobile {
  height: auto;
  flex: 0 0 auto;
}

#mobileMenu .nalezny-menu-contact {
  box-sizing: border-box;
  flex: 0 0 100%;
  min-width: 0;
  margin-top: .5rem;
  color: var(--nalezny-navy, #1b3049);
}

.nalezny-menu-contact__title {
  margin: 0 0 .55rem;
  color: var(--nalezny-navy, #1b3049);
  font-size: 1rem;
  font-weight: 700;
}

.nalezny-menu-contact__card {
  box-sizing: border-box;
  width: 100%;
  padding: .9rem 1rem;
  border: 1px solid #eedde0;
  border-radius: 12px;
  background: #fbf5f6;
  text-align: center;
}

.nalezny-menu-contact__intro,
.nalezny-menu-contact__copy {
  margin: 0 0 .75rem;
  font-size: .9rem;
  line-height: 1.5;
}

.nalezny-menu-contact__links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  margin: 0 0 .85rem;
}

.nalezny-menu-contact__links a,
.nalezny-menu-contact__copy a {
  color: #9a3028;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-decoration: underline;
  text-underline-offset: .15em;
}

.nalezny-menu-contact__copy:last-child {
  margin-bottom: 0;
}

/* Keep numbered homepage services in aligned pairs on desktop. */
@media (min-width: 992px) {
  #wrapper .nalezny-home .nalezny-service-band {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    align-items: stretch;
    padding-inline: max(
      var(--nalezny-content-gutter),
      calc((100% - var(--nalezny-content-max-width)) / 2)
    );
  }

  #wrapper .nalezny-home .nalezny-service {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: 0;
    padding: 32px 22px;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 18px;
    border-bottom: 1px solid var(--nalezny-border);
  }

  #wrapper .nalezny-home .nalezny-service__body h3 {
    min-height: 2.6em;
  }

  #wrapper .nalezny-home .nalezny-service:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    width: calc(50% - 12px);
    justify-self: center;
  }
}

/* Replace the theme's heavy menu focus ring with a lighter keyboard cue. */
#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link:hover,
#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link:active,
#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link:focus,
#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link:focus-visible,
#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link.active,
#header .ps-mainmenu .ps-mainmenu__tree > li.current .ps-mainmenu__tree-link {
  outline: none;
  outline-offset: 0;
  box-shadow: none;
}

#header .ps-mainmenu .ps-mainmenu__tree .ps-mainmenu__tree-link:focus-visible {
  text-decoration-line: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .3em;
}
