/**
* Theme Name:         Favorit
* Theme URI:          https://github.com/lmandcreative/favorit-wp
* Author:             LM Someco
* Author URI:         https://lmsomeco.fi/
* Description:        A modern block theme for WordPress.
* Version:            1.0
* Requires at least:  6.8
* Tested up to:       6.8.2
* Requires PHP:       8.4
* License:            GNU General Public License v2 or later
* License URI:        http://www.gnu.org/licenses/gpl-2.0.html
* Text Domain:        favorit
* GitHub Theme URI:   https://github.com/lmandcreative/favorit-wp
* Primary Branch:     main
*/

/**
* Breakpoints
* Mobile - <761px
* Tablet - 782-1199.98px
* Desktop - >1200px
*/

/* Styles intended only for the front.*/
html {
  scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

:where(.wp-site-blocks) > *:not(footer) {
  /*margin-block-start: var(--wp--preset--spacing--10);*/
  margin-block-start: 100px;
  margin-block-end: 0;
}

/* Header Styles */

header.site-header {
  position: fixed;
  z-index: 1000;
  top: 0;
  width: 100%;
  transition: background 0.3s ease-in-out;
  background-color: var(--wp--preset--color--base);
}

/* Admin Bar Fix */
body.admin-bar header.site-header {
  top: 32px;
}
@media screen and (min-width: 782px) and (max-width: 1704px) {
  header.site-header > .wp-block-group {
    padding-right: var(--wp--style--root--padding-right) !important;
    padding-left: var(--wp--style--root--padding-left) !important;
    margin: 0;
  }
}

@media screen and (max-width: 782px) {
  header.site-header nav.wp-block-navigation > button {
    margin-right: 16px !important;
  }

  header.site-header
    nav.wp-block-navigation
    button.wp-block-navigation__responsive-container-close {
    top: 16px !important;
  }

  body.admin-bar header.site-header {
    top: 46px;
  }
  body.admin-bar header.site-header.scrolled {
    top: 0;
  }
}

header.site-header.scrolled {
  background-color: var(--wp--preset--color--primary);
}

header.site-header #favorit-logo-text,
header.site-header #contact-cta-corner,
header.site-header.scrolled #favorit-logo-notext,
header.site-header.scrolled #contact-cta-nocorner {
  display: block;
}

header.site-header #favorit-logo-notext,
header.site-header #contact-cta-nocorner,
header.site-header.scrolled #favorit-logo-text,
header.site-header.scrolled #contact-cta-corner {
  display: none;
}

header.site-header .wp-block-group a > figure.wp-block-image {
  margin: 0 !important;
}

header.site-header
  .wp-block-navigation
  .has-child
  .wp-block-navigation__submenu-container
  > .wp-block-navigation-item
  > .wp-block-navigation-item__content {
  flex-grow: 0;
}

.wp-block-navigation
  .wp-block-navigation__responsive-container-content
  .wp-block-navigation-item__label {
  position: relative;
}

.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item__label {
  position: relative;
}

.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item__label::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--wp--preset--color--primary);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item__label:hover::before,
.wp-block-navigation
  .wp-block-navigation-item.current-menu-item:not(.has-child)
  .wp-block-navigation-item__label::before,
.wp-block-navigation
  .wp-block-navigation-item.current-menu-ancestor
  > a
  > .wp-block-navigation-item__label::before {
  opacity: 1;
}

header.site-header.scrolled
  .wp-block-navigation
  .wp-block-navigation__container
  .wp-block-navigation-item__label::before {
  background-color: var(--wp--preset--color--contrast);
}

@media screen and (max-width: 1169px) {
  .wp-block-navigation__submenu-container {
    padding: 0 0 0 20px !important;
  }

  li.wp-block-navigation-item a.wp-block-navigation-item__content {
    font-size: 20px !important;
    margin-bottom: var(--wp--preset--spacing--10) !important;
  }

  ul.wp-block-navigation-submenu li.wp-block-navigation-item a.wp-block-navigation-item__content {
    font-size: 18px !important;
  }

  ul.wp-block-navigation-submenu {
    gap: var(--wp--preset--spacing--10) !important;
  }
  header.site-header > .wp-block-group.alignwider {
    gap: 0;
  }
  header.site-header > .wp-block-group.alignwider > .wp-block-group {
    width: 100%;
    justify-content: center;
    margin-left: calc(
      24px + (var(--wp--style--root--padding-left) + var(--wp--style--root--padding-right))
    );
  }
  header.site-header > .wp-block-group.alignwider > .wp-block-group > a {
    width: 100%;
    text-align: center;
  }
}

header.site-header
  nav.getdave-responsive-navigation-block-is-mobile
  .wp-block-navigation__responsive-container {
  background-color: var(--wp--preset--color--primary) !important;
}

/* Footer Styles */

footer.site-footer hr.has-background {
  width: calc(100% + (var(--wp--preset--spacing--50) * 2));
  margin-left: calc(var(--wp--preset--spacing--50) * -1) !important;
  margin-right: calc(var(--wp--preset--spacing--50) * -1) !important;
  background-color: hsl(0, 0%, 40%) !important;
  color: hsl(0, 0%, 40%) !important;
  border-top-width: 1px !important;
}

/* Content width hack */
.alignwider {
  max-width: 1640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Forminator Styles */

form.forminator-custom-form .forminator-row {
  margin: 0 0 var(--wp--preset--spacing--10) 0;
}

form.forminator-custom-form .forminator-row .forminator-field input[type="text"],
form.forminator-custom-form .forminator-row .forminator-field input[type="email"],
form.forminator-custom-form .forminator-row .forminator-field textarea {
  background-color: var(--wp--preset--color--base);
  border: 0;
  border-bottom: 1px solid var(--wp--preset--color--contrast);
  border-radius: 0;
  font-family: var(--wp--preset--font-family--apex-rounded-book);
  font-size: var(--wp--preset--font-size--body-s);
  padding: var(--wp--preset--spacing--10);
  width: 100%;
}

form.forminator-custom-form .forminator-row .forminator-field textarea {
  min-width: 100%;
  max-width: 100%;
  max-height: 400px;
}

form.forminator-custom-form .forminator-row .forminator-field label.forminator-checkbox {
  display: flex;
}

form.forminator-custom-form
  .forminator-row
  .forminator-field
  label.forminator-checkbox
  input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 17px;
  height: 17px;
  border: 1px solid #000;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
}

form.forminator-custom-form
  .forminator-row
  .forminator-field
  label.forminator-checkbox
  span.forminator-checkbox-label {
  margin-left: 8px;
  line-height: 1.2;
}

form.forminator-custom-form
  .forminator-row
  .forminator-field
  label.forminator-checkbox
  input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20,6 9,17 4,12'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

form.forminator-custom-form .forminator-row .forminator-field input:focus,
form.forminator-custom-form .forminator-row .forminator-field input:focus-visible,
form.forminator-custom-form .forminator-row .forminator-field textarea:focus,
form.forminator-custom-form .forminator-row .forminator-field textarea:focus-visible {
  outline: 2px solid var(--wp--preset--color--contrast);
}

form.forminator-custom-form .forminator-field button.forminator-button {
  background-color: var(--wp--preset--color--secondary);
  border: 0;
  box-shadow: none;
  color: var(--wp--preset--color--base);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
  cursor: pointer;
  font-family: var(--wp--preset--font-family--apex-rounded-medium);
  font-size: var(--wp--preset--font-size--body-m);
  padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
  transition: background-color 0.15s ease-in-out;
}

form.forminator-custom-form .forminator-field button.forminator-button:hover {
  background-color: #03588c;
}

form.forminator-custom-form .forminator-row .forminator-error-message {
  color: red;
  font-size: 14px;
}

form.forminator-custom-form .forminator-response-message {
  color: red;
  font-size: 18px;
  margin-bottom: var(--wp--preset--spacing--10);
}

form.forminator-custom-form .forminator-select--field {
  display: block;
  width: 100%;
  padding: var(--wp--preset--spacing--10);
  font-size: var(--wp--preset--font-size--body-s);
  font-family: inherit;
  line-height: 1.3;
  color: #222;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 0;
  background: #fff
    url("data:image/svg+xml;utf8,<svg fill='%23666' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>")
    no-repeat right 14px center;
  background-size: 1.5rem;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.02);
  -webkit-appearance: none; /* piilottaa oletusnuolen useimmissa selaimissa */
  appearance: none;
  cursor: pointer;
}
form.forminator-custom-form .forminator-select--field:focus {
  outline: none;
  border-color: #4f8ef7;
  box-shadow: 0 0 0 3px rgba(79, 142, 247, 0.12);
}

/* Personel */

#personel .wp-block-group > .wp-block-image {
  flex-shrink: 0 !important;
}

/* Tablet specific styles */
@media screen and (min-width: 782px) and (max-width: 1199.98px) {
  /* Styles for Frontpage hero */
  .wp-block-columns#frontpage-hero {
    gap: 8px;
  }

  .wp-block-columns#frontpage-hero > .wp-block-column {
    flex-basis: 50%;
  }

  .wp-block-columns#frontpage-hero > .wp-block-column:nth-child(2) {
    padding: var(--wp--preset--spacing--20) !important;
  }

  /* Personel */
  #personel {
    gap: var(--wp--preset--spacing--30) !important;
  }
}

/* Mobile specific styles */
@media screen and (max-width: 781.98px) {
  /* Ingress */
  .ingress :not(.wp-block-heading).has-text-align-center {
    text-align: left !important;
  }

  /* No padding on sides */
  .no-padding-mobile {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Personel */
  #personel {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}

/* CookieBot Styles */

/* Branding on the banner */
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText {
  display: none;
}

/* Branding on the Privacy trigger */
#CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo {
  display: none;
}
