/*
Theme Name: WPJutsu theme 
Theme URI: 
Author: Paul Gaugris
Author URI: https://www.wp-justu.com
Description: Thème FSE pour www.wpjutsu.com
Requires at least: 6.5
Tested up to: 6.5
Requires PHP: 8.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wpjutsu
*/

*,
html {
  scroll-behavior: smooth !important;
}

::selection {
  color: var(--wp--preset--color--light);
  background-color: var(--wp--preset--color--primary);
}

body.home .wp-block-group:has(.breadcrumbs) {
  display: none;
  visibility: hidden;
}

/* Animations */

.wpjutsu-animation {
  transform: translateY(100px);
  opacity: 0;
  transition:
    transform 0.5s ease,
    opacity 0.5s ease;
}

.wpjutsu-animation.show {
  transform: translateY(0);
  opacity: 1;
}

.wpjutsu-clip figure {
  clip-path: inset(99% 0 0 0);
  transition: clip-path 0.5s ease;
}

.wpjutsu-clip.show figure {
  clip-path: inset(0 0 0 0);
}

/* Formulaire  */

.nf-before-form-content {
  font-style: italic;
  font-size: var(--wp--preset--font-size--xs);
  margin-bottom: var(--wp--preset--spacing--s);
}

.nf-form-content button,
.nf-form-content input[type="button"],
.nf-form-content input[type="submit"] {
  font-family: var(--wp--preset--font-family--secondary);
  border: 1px solid var(--wp--preset--color--dark);
  font-size: var(--wp--preset--font-size--m);
  background-color: var(--wp--preset--color--dark);
  border-radius: 35px;
  padding: 16px 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
  cursor: pointer;
  transition: none;
}

.nf-form-content button:hover,
.nf-form-content input[type="button"]:hover,
.nf-form-content input[type="submit"]:hover {
  background-color: var(--wp--preset--color--light);
  color: var(--wp--preset--color--dark);
  transition: none;
}

.nf-form-content input:not([type="submit"]),
.nf-form-content textarea {
  color: var(--wp--preset--color--dark);
  border-radius: 5px;
}

/* Price block */

.popular {
  position: relative;
}

.popular::after {
  content: "🔥 Popular";
  text-transform: uppercase;
  position: absolute;
  font-size: 12px;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--light);
  padding: 8px 32px;
  letter-spacing: 2px;
  border: 1px dashed var(--wp--preset--color--primary);
  border-radius: 5px;
}

/* FAQ Block */

.wp-block-wpseopress-faq-block-v2 details {
  border-radius: 25px;
}

.wp-block-wpseopress-faq-block-v2 summary::marker {
  content: "";
}

.wp-block-wpseopress-faq-block-v2 summary {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}

.wp-block-wpseopress-faq-block-v2 summary::after {
  content: url(assets/images/arrow-light.svg);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
  transition: transform 0.3s ease;
}

.wp-block-wpseopress-faq-block-v2 details[open] summary {
  color: var(--wp--preset--color--primary);
}

.wp-block-wpseopress-faq-block-v2 details[open] summary::after {
  transform: rotate(90deg);
}

/* Demo block */

.wp-block-group.premium {
  position: relative;
}

.wp-block-group.premium::after {
  content: "Premium";
  font-size: 10px;
  font-weight: 400;
  position: absolute;
  top: -10px;
  left: -20px;
  background-color: var(--wp--preset--color--dark);
  border-radius: 999px;
  transform: rotate(-5deg);
  color: var(--wp--preset--color--light);
  padding: 10px;
}

/* Footer */

footer {
  position: relative;
  margin-top: 150px;
}
footer::before {
  content: "";
  background: url(assets/images/section.svg) no-repeat;
  height: 100px;
  position: absolute;
  bottom: calc(100% - 1px);
  left: 0;
  right: 0;
}

/* My account Freemius */

#fs_dashboard_container {
  position: relative !important;
  inset: unset;
  min-height: 800px;
  width: 100%;
  height: 100%;
  max-width: 100%;
}

@media screen and (max-width: 1279px) {
  header :is(.wp-block-group, .wp-block-buttons) {
    gap: var(--wp--preset--spacing--xs);
  }

  header .wp-block-buttons .wp-block-button:first-child {
    display: none;
  }

  .wp-block-navigation {
    order: 1;
  }

  /* hamburger button */
  .wp-block-navigation__responsive-container-open {
    display: flex !important;
    padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--s);
    justify-content: center;
    align-items: center;
    border: 1px solid var(--wp--preset--color--dark);
    border-radius: 35px;
  }

  /* full menu */
  .wp-block-navigation__responsive-container:not(.is-menu-open.has-modal-open) {
    display: none !important;
  }

  /* Mobile menu */

  .wp-block-navigation:not(.has-background)
    .wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--dark);
    padding: var(--wp--preset--spacing--xl);
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content
    .wp-block-navigation-item__content {
    padding: 0;
    color: var(--wp--preset--color--gray);
    font-size: var(--wp--preset--font-size--xl);
    font-weight: 300;
  }

  .wp-block-navigation__responsive-container-close {
    background: var(--wp--preset--color--primary);
    padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--s);
    border-radius: 50px;
  }

  .wp-block-navigation__responsive-dialog {
    margin-top: 0 !important;
  }

  .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
    display: none !important;
  }
}

@media screen and (max-width: 576px) {
  header .wp-block-buttons .wp-element-button,
  .wp-block-navigation__responsive-container-open {
    padding: 6px 12px;
  }
  .hide-on-mobile {
    display: none;
  }
}